jQuery函数回调和动画计时

我猜部分的波折是来自于你正在衰退的元素,它们的祖先正在衰退。

当您淡入某个对象时,它也会自动淡入其子对象,因此您可能应该这样做。

$('#content').children().fadeOut(500, function(){
    $('#kiosk').fadeIn(250);
});

.fadeIn() 将被要求一次 淡出的元素。这也可能是个问题。

因为(大概) #kiosk 是…的直系后裔 #content fadeIn() .delay() 是需要的。

试一试: http://jsfiddle.net/rrM28/

$('#content').children().fadeOut(500).filter('#kiosk').fadeIn(250);

编辑: 法登() 正在立即运行,因为 最初是隐藏的,因此该动画立即完成,链继续。

一个解决方案是放置 .fadeIn() 在动画中 .queue() fadeOut() 已完成。

试一试: http://jsfiddle.net/rrM28/4

$('#viewer a').click(function(e) {
    e.preventDefault();
           // Don't fadeOut the #kiosk
    $('#content').children(':not(#kiosk)').fadeOut(500)
           // Place the fadeIn of #kiosk in the next step of the animation queue
        .queue(function() {
            $(this).siblings('#kiosk').fadeIn(250).dequeue();
        });
});

• http://api.jquery.com/queue/