Question

I’m trying to figure out if this is possible.. I have an image map that does fade in / fade out based on hovers over certain parts.. the problem is that when the user hovers to a different area during the fade it finishes the fade it was doing then does the one for the area the mouse was moved to.. if the user moves quickly between a few different areas then the fades appear really jumpy and awkward, so I want to be able to disable the hover event (the fade) during the time that another fade is going on so it just ignores it..

I have thought about using some sort of delay but I don’t know if this can work since I would think it would delay the fade too.. any advice is appreciated.

Answer 1

I think you are referring to queue buildup problem there. Try using the stop method before the animation method eg:

$(...).stop().fadeIn();

More Info:

http://www.learningjquery.com/2009/01/quick-tip-prevent-animation-queue-buildup

As for smooth animation, you can go for jQuery Easing Plugin.