Jquery fadeOut队列

Question

我有两个div。一个有黑色背景和一个紫色。我使用jquery来淡出黑色div，也可以淡出紫色的div。然而，似乎两者都在试图同时发生。

我的问题是如何使紫色div在紫色div完全消失之后才会褪色。我听说过队列方法，但我不清楚如何使用它。

$("div.black").fadeOut();
$("div.purple").fadeIn().queue(); // <-- purple div still trys to fade in
// while black div is fading out.  
// I need the purple div to wait 
// until that black div has completely faded out.

Answer 1

像这样

$("div.black").fadeOut(function(){
    $("div.purple").fadeIn();
});

Answer 2

使用回调来尝试这个

$("div.black").fadeOut(400,function(){
    $("div.purple").fadeIn().queue();
});

Answer 3

fadeIn / fadeOut将回调函数作为其参数之一。该函数在动画完成后立即执行：

$(".black").fadeOut(function() {
    // this will run once the fadeOut animation is complete
    $(".purple").fadeIn();
});

Fiddle: http://jsfiddle.net/fAbBn/