Jquery - How to check: if .toggle('slide') ready?

Question

Hi, is it possible to check, if "toggle('slide') == ready

like ...

if(toggle silde != ready)
{
   return false;
}
else
{
   $('#div').toggle('slide', { direction: 'down' }, 450); 
} 

Thanks in advance! Peter

Answer 1

What you should do is enclose your code in jquery's onload handler, that executes only after the page loads and everything is okay to start doing scripting, something like this:

$(window).load(function(){
    $('#div').toggle('slide', { direction: 'down' }, 450); 
});

Here you tell jquery to execute your line after the page loads.

EDIT: you need to provide a callback to the function, jquery will call your callback when the effect finishes, check here: http://jsfiddle.net/Yn8He/

HTML:

<div id="info">loading..</div>
<input type="button" value="Toggle!" id="toggle" />
<div id="div" style="display: none">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>

JavaScript:

$(window).load(function(){
    window.isDivTogglingNow=false;
    $('#toggle').bind('click', function(){

        $('#div').slideToggle(1000, function() {
            window.isDivTogglingNow=false;
        });
        window.isDivTogglingNow=true;
    })
    setInterval(function() {
        $('#info').text('Toggling: '+(window.isDivTogglingNow? 'Yes' : 'No'));
    }, 50);
});