JQuery中的元件fadeOut()和fadeIn()时的replaceWith() [英] replaceWith() while elements fadeOut() and fadeIn() in JQuery

问题描述

我想做的就是简单地淡出容器中的所有图像，将#next1的图像替换为#active，然后再次淡入所有图像.

What I'm trying to do is simply, fadeout all images inside containers, replace #next1's image to #active and after that fadein all images again.

这是我的代码:

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

这不起作用.我发现自己看着空荡荡的#active

this does not work. i found myself looking at the empty #active

但是这个；

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

可以很好地进行替换，但不能替代我要尝试的动画.

makes the replacing just fine but not the animation i'm trying to do.

我在chrome和ie上都得到相同的结果.

i get same results with both chrome and ie.

推荐答案

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

My suggestion here would be to look at the promise/done methods in jQuery. As an example here you could do something like:

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

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

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

这篇关于JQuery中的元件fadeOut()和fadeIn()时的replaceWith()的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！