正确清除jQuery动画

Question

在我的代码中，我在每个轮播项目上设置动画，如下所示：

first_text1.fadeTo(textDuration, 1, function(){
    second_text1.fadeTo(textDuration, 1);
});

当幻灯片更改时，我调用以下内容，其中$animations包含添加了任何动画的所有对象：

$animations.stop(true, true);

然后我打电话给：

$animations.each(function() {
    $(this).removeAttr('style');
}); 

删除动画留下的任何内联CSS，这样我就可以在返回幻灯片时重复动画。

我的问题是样式永远不会从上面代码中的second_text1的第二个回调动画中删除。

我该如何解决这个问题？

Answer 1

没有看到$animations，很难说为什么second_text1的样式没有被删除。但是，通过个人经验，我注意到jQuery(':animated')的问题是它只查找正在制作动画的对象。动画完成的那一刻，对象不再考虑:animated。

据说，我建议为每个想要设置动画的对象添加一个类，并将其用作选择器而不是$animations。

所以我会做出以下更改：

1. 在动画之前添加课程，在本例中为.fadeTo()

   first_text1.addClass('animatedClass').fadeTo(textDuration, 1, function(){
       second_text1.addClass('animatedClass').fadeTo(textDuration, 1);
   });
   

2. 将$animations更改为班级

   $('.animatedClass').stop(true, true);
   
   $('.animatedClass').each(function() {
       $(this).removeAttr('style');
   }); 
   

样本： http://jsfiddle.net/GVjBn/19/

希望这就是你要找的东西。如果您有任何其他问题，请与我们联系！

快乐的编码！

Answer 2

这里的问题原来是变量中的选择器，其中一些变量有多个变量。

E.g。

var first_text2 = $('li#region-2 .text-elements h2, li#region-2 .text-elements h3');
var second_text2 = $('li#region-2 .text-elements p');

你的removeAttr函数在变量中的所有元素上都无法正常工作。为了解决这个问题，我不得不打电话给

first_text2.each( function() {
    $(this).removeAttr('style');
});

抱怨原本在我的问题中没有显示更多代码!!