jquery淡入淡出div中的背景图像 - 淡入淡出

试图让背景div自动旋转一系列图像。淡入淡出，不会穿越。想法是使用jquery通过css换出图像并淡入新图像。一个不错的交叉可能是不错的。这是相当轻的 - 或者看起来似乎并不使用插件。jquery淡入淡出div中的背景图像 - 淡入淡出

任何洞察力为什么没有得到一个更平滑的交叉/过渡？

setInterval(delayFunction, 10000); 

    function delayFunction() { 

     setTimeout(function(){ 
     $('#homeback').fadeOut('slow');  
     $('#homeback').css("background-image","url(images/home_02.jpg)").fadeIn('slow'); 
    },5000); 

     setTimeout(function(){ 
     $('#homeback').fadeOut('slow');  
     $('#homeback').css("background-image","url(images/home_03.jpg)").fadeIn('slow'); 
    },10000); 

     setTimeout(function(){ 
     $('#homeback').fadeOut('slow');  
     $('#homeback').css("background-image","url(images/home_04.jpg)").fadeIn('slow'); 
    },15000); 

     setTimeout(function(){ 
     $('#homeback').fadeOut('slow');  
     $('#homeback').css("background-image","url(images/home_01.jpg)").fadeIn('slow'); 
    },20000); 

    };

来源

2013-09-26 Stuff

您需要在fadeOut完成后更改背景图像*，否？ –

新背景图片和fadIN功能的应用是无关的，您要查找的是将两张图片叠加在一起并同时调整每张图片的Alpha通道。我现在正在使用我的电话，但如果明天没有回答，我会进行调查。 –

如果你想有一个旋转的简单的例子，看看我的jsfiddle：通过传递第二http://jsfiddle.net/3yN8a/2/

的意见是正确的，你需要调整背景影像之后的淡出已完成和你做当它完成时用作回调的选项。

$(selector).fadeout('speed',function(){ 
    //execute your background switch then fade in. 
});

来源

2013-09-26 01:50:15 Chausser

jquery淡入淡出div中的背景图像 - 淡入淡出

回答

相关问题