CODEWITHSUNDEEP
jqueryslidetoggle
benhowdle89
benhowdle89

Reputation: 37464

No effect on slideToggle() jQuery

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?

Upvotes: 5

Views: 3959

Answers (2)

Tom
Tom

Reputation: 12998

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/

Upvotes: 7

ashish.chotalia
ashish.chotalia

Reputation: 3746

This works fine. 

 $("h3").click(function () {
                $("#tbl").slideToggle("slow");
            });


<h3>a</h3>
        <table id="tbl">
            <tr>
                <td>1</td>
            </tr>
            <tr>
                <td>2</td>
            </tr>
            <tr>
                <td>3</td>
            </tr>
        </table>

Upvotes: 0

Related Questions