jquery - 停止特定的 jQuery 动画

Question

我在单个对象上有多个动画，并且我需要停止特定动画而不是所有动画。 .stop() 方法似乎无法做到这一点。

例如，当同时设置不透明度和宽度的动画时，我可能需要取消不透明度动画，同时仍完成宽度动画。这似乎是不可能的，但我希望有人知道我缺少的技巧或 API 调用。

注意:我不是在谈论排队动画，我希望同时为多个属性设置动画，并能够在其中一些属性动画开始后停止

Answer 1

我讨厌成为一个回答自己问题的人(非常感谢您的详细答复并投入脑力!)，但我找到了直接的答案。显然，.animate() 方法有一个名为“queue”的参数，该参数默认为 true，但您可以将其设置为 false 以使动画立即发生。

这意味着通过将队列设置为 false，您可以使用单独的调用运行多个动画，而无需等待前一个动画完成。更好的是，如果您尝试为已经进行动画处理的属性运行动画，第二个将覆盖第一个。这意味着您只需使用队列“false”将其“动画”到其当前值(持续时间为 0)即可停止属性的动画。

示例:

$myElement = $("#animateElement");
$myElement.animate({width: 500}, {duration: 5000});
$myElement.animate({height: 500}, {duration: 5000, queue: false});
// ... Wait 2 seconds ...
$myElement.animate({width: $myElement.width()}, {duration: 0, queue: false});

Another option是由一位慷慨的 jQuery 贡献者建议的，他响应了我的增强请求。这利用了在动画上使用步进函数的能力(在动画中的每个点调用步进函数，并且您可以根据您想要的任何标准操作动画参数)。虽然这也可以解决问题，但我觉得它比“queue: false”选项脏得多。