如何插入淡入淡出效果？

Question

此代码每20秒将背景更改为

如何插入淡入和淡出效果？

我的jQuery代码

    var bg = $('#bg');
    var backgrounds = new Array(
        'url(1.jpg)',
        'url(2.jpg)',
        'url(3.jpg)',
        'url(4.jpg)');

    var current = 0;

    function nextBackground() {
        bg.css(
            'background',
        backgrounds[current = ++current % backgrounds.length]);
        setTimeout(nextBackground, 20000);
    }

    setTimeout(nextBackground, 20000);
    bg.css('background', backgrounds[0]);

Answer 1

Tks！ 我找到了一个解决方案

码

var currentBackground = 0;

var backgrounds = [];

backgrounds [0] ='2.jpg';

backgrounds [1] ='3.jpg';

backgrounds [2] ='4.jpg';

backgrounds [3] ='5.jpg';

backgrounds [4] ='6.jpg';

函数changeBackground（）{

currentBackground++;

if(currentBackground > 4) currentBackground = 0;

$('#bg').fadeOut(500,function() {
    $('#bg').css({
        'background-image' : "url('" + backgrounds[currentBackground] + "')"
    });
    $('#bg').fadeIn(500);
});


setTimeout(changeBackground, 30000);

}

$（document）.ready（function（）{

setTimeout(changeBackground, 30000);  

}）;