結算jQuery的動畫正確

Question

在我的代碼，我在每旋轉木馬項目動畫對象，像這樣：

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

當滑動改變我打電話其中$animations包含所有具有任何動畫添加到它們的對象如下：

$animations.stop(true, true); 

，然後我打電話：

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

到REM刪除動畫中留下的任何內聯CSS，以便在返回該幻燈片時重複動畫。

我的問題是風格永遠不會從第二個回調動畫中刪除，這將在上面的代碼中爲second_text1。

我該如何解決這個問題？

Answer 1

這裏的問題原來是變量中的選擇器，其中一些變量有一個以上。

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'); 

Thee removeAttr函數在變量中的所有元素上都無法正常工作。爲了解決這個問題，我不得不打電話

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

道歉在我的問題不顯示更多的代碼最初！

Answer 2

沒有看到$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'); 
   }); 
   

DEMO： http://jsfiddle.net/GVjBn/19/

希望這是你在找什麼。如果您有任何其他問題，請告訴我！

快樂編碼！