1

一直试图让背景 div 在一系列图像中自动旋转。淡入淡出闪烁而不是交叉。想法是使用 jquery 通过 css 交换图像并淡入新图像。一个不错的交叉可能会很好。这是相当轻的重量 - 或者看起来并且宁愿不使用插件。

关于为什么没有获得更平滑的交叉/过渡的任何见解？ 

    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);

    };
4

1 回答 1

3

如果您想要一个简单的旋转示例，请查看我的 jsfiddle：http: //jsfiddle.net/3yN8a/2/

评论是正确的，您需要在淡出完成后调整背景图像，您可以通过传递第二个选项来完成此操作，该选项用作完成时的回调。

$(selector).fadeout('speed',function(){
     //execute your background switch then fade in.
});
于 2013-09-26T01:50:15.423 回答