jQuery using stop() with hide()/show()?

Question

Hey guys,
I wonder if it's somehow possible to use the stop() function (I normally use on animate()) with hide() or show().

if I quickly hover repeatedly over a div which uses show() to display some subdivs the show-animation repeats over and over again. The stop() function would stop that behaviour.

However I've no clue how I can use the stop() function with hide() or show().

Is that even possible?

Thank you
Regards Matt

Answer 1

You have to set a duration for your show / hide effect:

.hide('slow')

After that you are able to use .stop() and .stop(true,true)

stop( [ clearQueue ], [ jumpToEnd ] )

clearQueue A Boolean indicating whether to remove queued animation as well. Defaults to false.

jumpToEnd A Boolean indicating whether to complete the current animation immediately. Defaults to false.

Another approach would be to add an delay like

 .delay(500).hide(1);

http://api.jquery.com/delay/

.delay( duration, [ queueName ] ) duration An integer indicating the number of milliseconds to delay execution of the next item in the queue.

queueName A string containing the name of the queue. Defaults to fx, the standard effects queue.

Answer 2

You would call the stop function on the element that the animation was called on. Also you would want to set the clearqueue parameter so you aren't just stopping the first form of the animation but any queued up animations that are waiting to run.

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