jQuery – 中断动画？

一旦用户点击某些内容，我就会将jQuery用于一些简单的动画效果。 但是，如果他们在第一个动画完成之前再次单击，则没有任何反应。 他们必须等到第一个动画结束。

有没有办法打断动画过程，并在第二次点击时从头开始？

谢谢。

Answer 1

你可以使用stop()方法

HTML：

   
Testing 

JS：

 $("#start").click(function() { $("div").fadeOut("slow"); }); $("#stop").click(function() { $("div").stop(); }); 

编辑：上面的代码经过测试，适用于FF3.5和IE8

在你想要中断动画的元素上使用它。

请记住，元素将停止动画中动画。 因此，您可能需要在停止后重置CSS，具体取决于您的具体情况。

edit2：从jQuery 1.7开始，有一些更新。 您现在可以使用名称对动画队列进行分组。 因此stop()方法将接受布尔值或字符串作为第一个参数。 如果它是布尔值，它将清除/不清除所有队列。 但是如果你提供一个字符串，那么它只会清除该队列组中的动画。

Answer 2

你可以在重新启动动画之前停止（）

 $("#start").click(function() { $("div").stop().fadeOut("slow"); }); 

Answer 3

听起来像是出队的工作。