That's because jQuery queue animations and fadeIn/fadeOut
are animations. Basically, jQuery register what animation should be next and do it when the current animation is done.
To stop that, you can use .stop()
before animating the object.
if (currentTop == 0) {
$("#binding-info").stop().fadeIn('slow');
} else {
$("#binding-info").stop().fadeOut('slow');
}
But there is a problem with fadeIn
. If you do the fadeOut
before it reach 1 opacity, it will keep it in data and will not fadeIn
to 1 again.
The hot fix would be to use fadeTo()
:
$("#binding-info").stop().fadeTo('slow', 1);