javascript - replaceWith() 而 JQuery 中的元素 fadeOut() 和 fadeIn()

Question

我想做的很简单，淡出容器内的所有图像，将#next1 的图像替换为#active，然后再次淡入所有图像。

这是我的代码:

$('.logo').fadeOut('slow', function() {
    $('#active>img').replaceWith( $('#next1>img') );
}).fadeIn('slow', function() {});

这是行不通的。我发现自己看着空的#active

但这不过;

$('.logo').fadeOut('slow', function() {}).fadeIn('slow', function() {});
$('#active>img').replaceWith( $('#next1>img') );

使替换很好，但不是我正在尝试做的动画。

我在 chrome 和 ie 上得到了相同的结果。

Answer 1

我的建议是查看 jQuery 中的 promise/done 方法。作为示例，您可以执行以下操作:

$('.logo').fadeOut('slow').promise().done(function(logo) {
    $('#active>img').replaceWith($('#next1>img'));
    $(logo).fadeIn('slow');
});

jQuery promise - http://api.jquery.com/promise/