fadeOut回调在动画完成之前执行

Question

我的印象是,在fadeOut完成之后,下面的回调函数中的css规则才会执行.情况似乎并非如此.回调函数中的行实际上是在单击时执行的.我出错的任何想法？

$('a.close_link, #lightbox').click(function(){  
    $('#lightbox, .lightbox_panel').fadeOut(300,function(){
        $('.instructor_video').css('left','150%');
        $('.instructor_bio').css('left','50%');
    });
    return false;
 });

Answer 1

您的'#lightbox, .lightbox_panel'选择器可能与已隐藏的元素匹配.记住了.fadeOut(),并且回调被调用每个元素选择的比赛,你必须也认识到,对于已隐藏要素的complete回调被称为立即(它必须做的工作是....完成,对吧？).

要消除此处的"即时完成",您可以隐藏:visible实际需要隐藏的元素,如下所示:

$('#lightbox:visible, .lightbox_panel:visible').fadeOut(300,function(){
    $('.instructor_video').css('left','150%');
    $('.instructor_bio').css('left','50%');
});

或者您可以通过.filter()调用获得相同的元素,如下所示:

$('#lightbox, .lightbox_panel').filter(':visible')