使用jQuery更改CSS與延遲

Question

屬性如何使用jQuery的與延遲改變HTML元素的CSS 屬性。

想象一下這種情況。我有div與bg color藍色。我希望它淡出，當它淡入，我想bg color是紅色的。

我試過了。

$("div").fadeOut().delay(500).css("background-color","red").fadeIn(); 

雖然淡出格已經改變了顏色以紅色它消失之前，它不遵循鏈的事件序列。我怎樣才能使這一切發生在一條線上。

Answer 1

你可以使用任何功能參與動畫隊列queue function：

$("div") 
    .fadeOut() 
    .delay(500) 
    .queue(function() { 
     $(this).css("background-color","red").dequeue(); 
    }) 
    .fadeIn(); 

注意回調中的dequeue通話，這就是告訴jQuery來繼續在隊列中的下一件事。

Answer 2

$("div").fadeOut(500, function() { 
    $("div").css("background-color","red").fadeIn() 
});