问题描述
我在一个对象上有多个动画，因此我需要停止特定的动画而不是全部动画.看起来.stop()方法无法做到这一点.
I have multiple animations on a single object, and I need to stop a specific animation rather than all of them. It doesn't look like the .stop() method can do this.
例如，当同时对不透明度和宽度设置动画时，我可能需要取消不透明度动画，同时仍要完成宽度动画.看来这是不可能的，但我希望有人知道我所缺少的技巧或API调用.
For instance, when animating opacity and width simultaneously, I may need to cancel the opacity animation while still completing the width animation. It would seem that this is not possible, but I am hoping that someone knows a trick or an API call that I'm missing.
注意:我不是在谈论排队动画，而是希望同时为多个属性设置动画，并能够在某些属性动画开始播放后将其停止 >
Note: I'm not talking about queued animations, I'm looking to animate multiple attributes at the same time with the ability to stop some of those attribute animations after they have already started
推荐答案
我讨厌成为一个回答自己问题的人(非常感谢详细的回答，并为此投入了脑力！)，但我发现了一个直接的答案回答.显然，.animate()方法有一个名为"queue"的参数，默认为true，但您可以将其设置为false，以使动画立即发生.
I hate to be a guy who answers his own question (thanks so much for the detailed responses and putting brain power into it!) but I have found a direct answer. Apparently there is a parameter for the .animate() method called "queue" which defaults to true but you can set to false in order to have your animation take place immediately.
这意味着通过将queue设置为false，您可以使用单独的调用来运行多个动画，而不必等待上一个动画完成.更好的是，如果您尝试为已经被动画处理的属性运行动画，则第二个将覆盖第一个.这意味着您可以使用队列"false"，通过将属性的动画持续时间为0来简单地动画化"为其当前值，从而停止该动画.
This means that by setting queue to false you can run multiple animations using separate calls without having to wait for the previous one to finish. Better yet, if you try to run an animation for a property which is already being animated, the second will override the first. This means you can stop a property's animation by simply "animating" it to its current value with a duration of 0, using queue "false".
示例:
$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});
另一个选项由一位仁慈的jQuery贡献者提出，他响应了我的增强请求.这利用了在动画上使用步进函数的能力(在动画的每个点都调用了步进函数，并且您可以根据所需条件来操纵动画参数).尽管这也可以解决问题，但我认为它比"queue:false"选项要肮脏得多.
Another option was suggested by a gracious jQuery contributor who responded to my enhancement request. This takes advantage of the ability to use a step function on an animation (step functions are called at every point in the animation, and you can manipulate the animation parameters based on whatever criteria you want). Although this also could have solved the issue, I felt it was far more dirty than the "queue: false" option.
这篇关于停止特定的jQuery动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！