Question

我所拥有的是工作但是我想看看是否有更好的方法来编写代码，而且我也在延迟使用mouseleave。实际的动画以所需的速度发生，但是在我的鼠标离开之后，它似乎需要大约2-3秒才能完成。

CSS初始设置为margin-left：-64px

$('.homeButton').mouseover(function(){
  $('.homeButton').animate({marginLeft:'0px'},'slow');  
});

$('.homeButton').mouseleave(function(){
   $('.homeButton').animate({marginLeft:'-64px'},200);  
});

Answer 1

您可以使用stop和hover方法。

停止匹配元素上当前正在运行的动画。

$('.homeButton').hover(function(){
     $(this).stop(true, true).animate({marginLeft:'0px'},'slow');  
}, function(){
     $(this).stop(true, true).animate({marginLeft:'64px'},'slow');  
})

JQuery使用margin进行动画制作

1 个答案: