0

我有一系列动画，如果用户不中断应该完成到最后。动画是使用延迟实现的。例如

$element1.delay(1000).animate({left: 1000}, 5000);
$element2.delay(2000).animate({left: 1000}, 5000);
$element3.delay(3000).animate({left: 1000}, 5000);
$element4.delay(4000).animate({left: 1000}, 5000);

我这样做的原因是因为这对我来说似乎很直观，因为每个动画都完全独立于其他动画的时间。

假设我希望在 2500 毫秒标记处中断动画，一旦中断，元素必须跳转到其动画状态的末尾。现在，我尝试在 .find(:animated) 选择上使用 .stop(false, true) 函数。$element1 和 $element2 确实被中断并跳转到了结束状态，但是由于 $element3 和 $element4 还处于它们的 .delay 阶段，所以它们不受影响。

达到我想要的效果的最好和最简单的方法是什么？谢谢

4

1 回答 1

0

我认为您正在寻找一种最近引入的finish()方法。如果将stop()'jumpToEnd 参数设置为 true，它只会影响队列中当前处理的项目。但是如果你调用finish()，它会跳转到整个队列的最终结果。

小提琴：http: //jsfiddle.net/SnTgS/

Finish()在 jQuery 1.9 中引入，但后来在 1.10.1 中修复了一些错误，因此您可能希望使用该版本和更新的版本。

http://api.jquery.com/finish/

在早期版本的 jQuery 中，我想您可以遍历队列长度并调用stop(false, true)队列中的每个项目。

于 2013-08-03T09:49:22.850 回答