Jquery fadeOut队列

Question

我有两个div。一个有黑色背景和一个紫色。我使用jquery淡出黑色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();
});

小提琴： http://jsfiddle.net/fAbBn/

Answer 4

你可以考虑使用setTimeout，它接受一个函数和一个等待的时间，以毫秒为单位。我认为这样的事情应该有效：

$("div.black").fadeOut(500);
setTimeout(function() {
    $("div.purple").fadeIn()
}, 600)