jQuery淡出然后淡入

Question

这个主题有一堆，但我没有找到一个适用于我的情况的实例。

淡入淡出的图片出来，然后淡入另一张照片。相反，我跑入其中，第一淡出，并立即一个问题（动画完成之前），在未来变淡。

我读到这一次，不记得什么诀窍是..

http://jsfiddle.net/danielredwood/gBw9j/

感谢您的帮助！

Answer 1

在淡出完成后运行的淡出回调中淡入另一个淡出。使用代码：

$('#two, #three').hide(); 
$('.slide').click(function(){ 
    var $this = $(this); 
    $this.fadeOut(function(){ $this.next().fadeIn(); }); 
}); 

或者，你可以只是“暂停”的连锁，但你需要指定多久：

$(this).fadeOut().next().delay(500).fadeIn(); 

Answer 2

这可能帮助：http://jsfiddle.net/danielredwood/gBw9j/
基本上$(this).fadeOut().next().fadeIn();就是你需要

Answer 3

jQuery 1.6后，使用诺言似乎是一个更好的选择。

var $div1 = $('#div1'); 
var fadeOutDone = $div1.fadeOut().promise(); 
// do your logic here, e.g.fetch your 2nd image url 
$.get('secondimageinfo.json').done(function(data){ 
    fadeoOutDone.then(function(){ 
    $div1.html('<img src="' + data.secondImgUrl + '" alt="'data.secondImgAlt'">'); 
    $div1.fadeIn(); 
    }); 
});