jQuery的延遲與多個選擇

Question

我知道你可以做這樣的事情：

$('#item').fadeOut().delay(1000).fadeIn(); 

將淡出與項目出來的ID的元素，然後逐漸把它再次插入之前等待一秒鐘。但是有沒有辦法淡化一個項目，並將其中一個項目拖延到另一個項目中。我已經試過這一點，但沒有奏效：

$('#item1').fadeOut().delay(1000).('#item2').fadeIn(); 

任何幫助非常讚賞

感謝

Answer 1

使用回調函數：

$("#item1").fadeOut(function() 
{ 
    $("#item2") 
      // Wait for 600 ms 
      .delay(600) 
      // Fade in 
      .fadeIn(); 
}); 

看到實況：http://api.jquery.com/fadeIn/

fadeIn（[d [回調]）

持續時間確定動畫運行時間的字符串或數字。

easing一個字符串，指示將哪個緩動函數用於轉換。

回調函數在動畫完成後調用。

Answer 2

淡化回調中的第二個元素，給它延遲而不是第一個元素。

如果你想延遲僅計算作爲第一個元素開始淡出，從總的延遲減褪色速度：

// Assuming default fading speed of 400 ms 
var speed = 400, delay = 1000; 

$('#item1').fadeOut(speed, function() { 
    $('#item2').delay(delay - speed).fadeIn(speed); 
}); 

如果你想延遲計算的第一個元素結束後動畫，使用完整的延遲值：

$('#item1').fadeOut(speed, function() { 
    $('#item2').delay(delay).fadeIn(speed); 
}); 

Answer 3

setTimeout(function() { $('#item1').fadeOut();}, 500); 
setTimeout(function() { $('#item2').fadeIn(); }, 1000);