restart jquery.fadeOut() while it's fading out

0 votes
asked Jan 5, 2011 by sf

I'd like to have a jquery fadeOut() restart whilst it's in the middle of fading out.

I have the following statement

$('#status').html('<div style="padding:5px; margin:0 0 0 200px;"><img src="/images/done.png" /> ' + message + '</div>').show().fadeOut(2000);

When a user performs an action, this statement gets run. for the 2 seconds it's running, the user can perform another action which calls this statement.

At the moment, the fadeOut has to complete before the fadeOut animation will play again.

Is there a way to make the fadeOut simply restart from the beginning again?

5 Answers

0 votes
answered Jan 5, 2011 by wildpeaks

Use .stop() before calling .fadeOut().

Optionally, use .stop(true, true) if you want it to start from the destination values.

0 votes
answered Jan 5, 2011 by simshaun
0 votes
answered Jan 5, 2011 by antoine-aubry

You can call stop before calling fadeOut. That will restart the fadeOut animation. Otherwise, the second fadeOut will be queued after the first one.

0 votes
answered Jan 22, 2013 by cgupta

Use

jQuery.stop().fadeOut() 

to prevent queueing up the fadeOut Animation.

.stop() can be used to prevent queueing any jQuery Animation 

http://api.jquery.com/stop/

0 votes
answered Sep 15, 2017 by dantalian

It's strange, but in my case better way was

//onclick 
  .stop(true, true).fadeIn().stop(true, true); //reset: stop old fadeOut and make visible again
  .fadeOut(); //again
Welcome to Q&A, where you can ask questions and receive answers from other members of the community.
Website Online Counter

...