Question

I’m using this very simple jQuery code:

            $("h3").click(function(){
                $(this).next("table").slideToggle("slow");
            });

The outcome itself actually works and the table does appear/disappear on click, but there is no effect of “slide” whatsoever – i’ve tried without “slow” and with “slow” – same result!?

Its almost like i’m just using .toggle()…

I cant see what could be wrong apart from the size of the table, which is only max, 12 rows.

Any ideas?

Answer 1

I don’t think slideToggle works on all elements… Table could be one of them… Can you place the table inside a div and run the slideToggle on the div??

Try this…

<h3>click</h3>
<div>        
<table>
            <tr>
                <td>1</td>
            </tr>
            <tr>
                <td>2</td>
            </tr>
            <tr>
                <td>3</td>
            </tr>
        </table>
</div>

and

$("h3").click(function(){
                $(this).next("div").slideToggle("slow");
            });

Working example shown here… http://jsfiddle.net/68mcY/