3

我有一个滑动 div 和几个按钮,它们将以不同的速度触发动画(通过使用不同的持续时间值)。

按钮类似于:[左 x2][左 x1][左 x0.5][右 x0.5][右 x1][右 x2]

我的代码目前是这样的:

  //leftVal is set based on where the div is currently placed
  //timeLeft is set based on which button is "on hover"  

  $('#content-holder').animate({       
    "left": leftVal        
  }, {queue:false, duration:(timeLeft), easing:"quadEaseOut"});       

这在 Chrome 中很好,但在 IE 等其他浏览器上,这会导致动画跳动,您可以明显地看到滚动的 div 在继续以新速度继续之前停止一瞬间。

我有一种感觉,实现变速滚动的最佳方法是直接影响动画的持续时间而不杀死它并开始一个新的,但我不确定这是否可能。有小费吗?

4

1 回答 1

1

我想你正在寻找这个:

$('#content-holder').stop().animate({       
"left": leftVal
}, {queue:false, duration:(timeLeft), easing:"quadEaseOut"});

.stop()杀死队列,然后开始动画。( http://api.jquery.com/stop/ )

当您向多个按钮发送垃圾邮件时,我通常使用它来避免我的网站崩溃。

请注意,因为您使用的是缓动,所以动画不会流畅运行。当您调用新动画时,缓动也会从一开始就“播放”。

但是,如果您遇到问题,请阅读说明,我猜这就是您想要的。

如果有帮助,请告诉我!

于 2011-09-27T10:23:28.087 回答