淡入停止工作，在循環

延遲時，我想補充.delay（）到這一點，所以每個項目將動畫一前一後。問題是，如果我將delay（）添加到元素，則fadeIn停止工作。淡入停止工作，在循環

工作的代碼（但無延遲...）

time = 500; 

for (var i=1;i<=5;i++){ 

    delay2 = (i * time); 
    $('<tr><td><h3>Hello</h3></td><td>'+i+'</td</tr>').hide().appendTo('#table').fadeIn("slow").css('display', 'table-row'); 

    // do more stuff here 

};

jsfiddle example

淡入不工作（因爲它有延遲...）

time = 500; 

for (var i=1;i<=5;i++){ 

    delay2 = (i * time); 
    $('<tr><td><h3>Hello</h3></td><td>'+i+'</td</tr>').hide().appendTo('#table').delay(delay2).fadeIn("slow").css('display', 'table-row'); 

    // do more stuff here 

};

jsfiddle example

有誰知道這是什麼問題？在第二個例子中，它應該一個接一個地動畫項目，但是這並沒有發生，它們甚至沒有動畫。

來源

2012-11-18 Aleix

「+ I + ''）」見TD – Jai

試試這個：

$('<tr><td><h3>Hello</h3></td><td>'+i+'</td</tr>') 
.appendTo('#table') 
.hide() 
.delay(delay2) 
.show('slow');

這裏的問題是，CSS的變化瞬間發生，而你希望它在淡入完成後發生。你不需要fadeIn的一切都在這裏，特別是因爲show會記得display屬性值，並自動恢復它。

這裏是一個小提琴：http://jsfiddle.net/u5dEp/7/

來源

2012-11-18 12:37:28

你的是正確的，因爲好，所以我可以完全接受你的，但其他用戶投入更多的精力，並提出了小提琴，所以我不得不把它給他 – Aleix

@Tebb足夠公平:) –

@Tebb我已經做了版本根據您的要求工作（我注意到其他人仍然是不完整的解決方案）。看看上面的小提琴。 –

你的回答：

$('<tr><td><h3>Hello</h3></td><td>'+i+'</td</tr>') 
.hide() 
.appendTo('#table') 
.delay(delay2) 
.fadeIn("slow") 
.queue(function() { $(this).css('display', 'table-row'); });

的解釋很簡單：當你鏈中走在隊列和事件不會在隊列中去的事件，沒有在隊列中去的事件將繞過它。 $ .css（）不會進入fx隊列，所以會立即執行。

的解決方案是使用$ .queue（）函數來排隊的非QUEUEABLE調用到FX隊列。

工作小提琴：http://jsfiddle.net/u5dEp/6/

（這是一個答案了大量的隊列）

來源

2012-11-18 12:36:47

編輯的jsfiddle的missiing結束標籤：HTTP：//的jsfiddle .net/u5dEp/2/ –

+1你應該把那個小提琴作爲你答案的一部分。 –

由於它的工作原理，但現在的CSS變化淡出後發言，所以你可以看到它是如何從CSS顯示：塊（由淡入效果添加），以顯示：錶行。有任何解決這個問題的方法嗎？看起來很糟糕。 – Aleix

即使這樣可以工作：http://jsfiddle.net/pYYFM/8/

time = 500; 

for (var i=1;i<=5;i++){ 

delay2 = (i * time); 
    $('<tr><td><h3>Hello</h3></td><td>'+i+'</td></tr>').hide().appendTo('#table').delay(delay2).fadeIn("slow").queue(); 
               ^-------missed this 
};

來源

2012-11-18 12:45:09 Jai

這是最好的解決方案，因爲它修復了顯示：錶行也是如此。 – Aleix

這不會正確顯示行（至少在Firefox中）。 'tr's用'display：block'呈現。 –

啊，你是對的，這很奇怪，但在他的小提琴看起來不錯。 – Aleix

淡入停止工作，在循環

回答

相關問題