Break animation of mouse enthusiast when switching current mouseleave ()

http://jsfiddle.net/ZtpEU/41/ heres simple animation in jquery. I'm trying to make the animation only come out when the mouse appears. Moreover, you will notice that if you desperately click and leave, element animations are remembered, and this basically makes them feverishly animated.

I am looking for this animation to be done only while the mouse hangs over this particular element. When moving, the animation then resets and animate the next hover'd element.

Sorry, these are very difficult words. I will be very attentive to the answers. Finally, I am still looking for this css transition effect (this only happens in google chrome, or I would do it this way)

+3
source share
1 answer

you can use the method stop():

$("li").on('mouseenter',function(){
  $(this).animate({"padding-left": "50px"}, "normal");
});
$("li").on('mouseleave',function(){
  $(this).stop(true).animate({"padding-left": "0px"}, "slow");
});

http://jsfiddle.net/ZtpEU/43/

+8
source

All Articles