Jquery Animate on Hover

前端之家收集整理的这篇文章主要介绍了Jquery Animate on Hover前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个文本,当我有一只鼠标时,我想要动画
例如:
$(".tabb tr").hover(
  function(){
    $(this).find("td #headie").animate({marginLeft:'9px'},'slow')
  },function() {
    $(this).find("td #headie").animate({marginLeft:'0px'},'slow')
  });

当这个..当我有鼠标在行上..表列动画通过移动一点。

这里的问题是:当我将鼠标光标反复移动到这些行上,然后停止并看到..即使没有将鼠标移到它上方,动画也会持续一段时间。
以后请保持运动ITSELF ..

我该怎么停止呢?

解决方法

我发现一个关于平滑jquery动画的很好的文章,我发现这是Chris Coyier在CSS技巧中的一个动画:

http://css-tricks.com/full-jquery-animations/

所以将它适合您的代码将如下所示:

$(".tabb tr").hover(
function(){
  $(this).filter(':not(:animated)').animate({
     marginLeft:'9px'
  },'slow');
// This only fires if the row is not undergoing an animation when you mouSEOver it
},function() {
  $(this).animate({
     marginLeft:'0px'
  },'slow');
});

本质上它会检查该行是否是动画,如果不是,则只会将其称为鼠标器动画。

希望你的行现在有点像这个页面的最后两个例子:

http://css-tricks.com/examples/jQueryStop/

猜你在找的jQuery相关文章