Question

如果你去一张专辑（比如大自然，因为还在为其他人工作）并点击其中一张图片，它们都会淡出，然后你点击的图片就会出现在屏幕上。正在发生的事情是，随着缩略图逐渐淡出，它仍在消失。我尝试在.complete（）中添加其余代码，但这似乎打破了它。

$(document).ready(function(){


$('.photos').on('click', function() {

    var src = $(this).attr('src').replace('thumb-','');
    $('.photos').stop().fadeOut(500);
        $('.enlarged').remove();
        $('#album').append('<img class="enlarged" src="' + src + '">');
        $('.enlarged').hide();
        $('.enlarged').stop().fadeIn(500).done(
            $('.enlarged').on('click', function () {

                $(this).stop().fadeOut({

                    duration: 500,
                    done: this.remove()
                });

                $('.photos').stop().fadeIn(500);

            })
        );
});

});

Answer 1

您可以使用promise来捕捉所有淡出动画：

$(document).ready(function(){

  $('.photos').on('click', function() {

    var src = $(this).attr('src').replace('thumb-','');
    var photos = $('.photos');
    photos.stop().fadeOut(500);

    photos.promise().done( function() {
        $('.enlarged').remove();
        $('#album').append('<img class="enlarged" src="' + src + '">');
        $('.enlarged').hide();
        $('.enlarged').stop().fadeIn(500).done(
            $('.enlarged').on('click', function () {

                $(this).stop().fadeOut({    
                    duration: 500,
                    done: this.remove()
                });

                $('.photos').stop().fadeIn(500);

            })
        );
    });

  });

});

无法在jquery中获取元素动画以等待另一个元素动画

1 个答案: