Question

I know there is a way to stop the code from looping everytime you call an animation in jquery but for the life of me i can not find it!

How can i turn this code below in order for it not to keep looping if i push the button more than one?

$('#message-box').slideDown('slow').delay(10000).slideUp('slow');

If i hit the button that calls that more than once then it slides down, displays for 10 secs, slides back up then back down again.

What i would like it to do is if its already down and i hit the button then NOT to display it again. Or if nothing else, slide up the current message and slide down the new one right then and there without the delay between.

Any help would be great!

David

Answer 1

You could try this:

$('#message-box').stop(true,true).slideDown('slow').delay(10000).slideUp('slow');

If there is a down-delay-up animation already in progress for the element then .stop(true) will stop that, clear the element’s animation queue, and only then requeue the down-delay-up thing.

Demo: http://jsfiddle.net/bSeE7/