Jquery 手动背景div幻灯片放映

我需要做一个css背景图像淡入幻灯片。由于几个原因，我的html中不能有物理div。它是一个名为home的类的主体，具有当前的背景。幻灯片将有4张图片，不多不少，因此不必动态

我已经有了以下jquery：

<script type="text/javascript">
$(document).ready(function() {
    var original_image = '#000000 url(images/bg_home.jpg) top center no-repeat';
    var second_image = '#000000 url(images/bg_home2.jpg) top center no-repeat';
    var third_image = '#000000 url(images/bg_home3.jpg) top center no-repeat';
    var fourth_image = '#000000 url(images/bg_home4.jpg) top center no-repeat';

    $('.home').click(function() {
        $(this).css('background', second_image);
    });
});
</script>

$（文档）.ready（函数（）{
var original_image='#000000 url（images/bg_home.jpg）顶部中心不重复'；
var second_image='#000000 url（images/bg_home2.jpg）顶部中间不重复'；
var third_image='#000000 url（images/bg_home3.jpg）顶部中间不重复'；
var fourth_image='#000000 url（images/bg_home4.jpg）顶部中间不重复'；
$（'.home'）。单击（函数（）{
$（this.css（'background'，second_image）；
});
});

所以，正如你所看到的，这是一个非常简单的脚本，只有在我点击general-home-div时才有效。有人能帮我将它转换成一个简单的淡入淡出幻灯片而不点击吗？它应该刚开始执行淡入淡出幻灯片加载

多谢各位

建议：

$(function(){
   var images = [
       'bg_home.jpg',
       'bg_home2.jpg',
       'bg_home3.jpg',
       'bg_home4.jpg' 
   ],
   loop = 0,
   $home = $('.home');

   (function fader(){
        $home
        .fadeOut('fast', function(){
            $home.css('background', '#000000 url(' + images[loop] + ') top center no-repeat');
            $home.fadeIn('fast', function(){
                 setTimeout(fader, 3000);
            });
        });

        if(loop < images.length) 
           loop++;
        else loop = 0;                
    })();         
});

$（函数（）{
变量图像=[
“bg_home.jpg”，
“bg_home2.jpg”，
“bg_home3.jpg”，
“bg_home4.jpg”
],
循环=0，
$home=$（“.home”）；
（功能推子（）{
$home
.fadeOut（'fast'，function（）{
$home.css（'background'，'000000URL（'+images[loop]+'）顶部中间不重复）；
$home.fadeIn（'fast'，function（））{
设置超时（音量控制器，3000）；
});
});
if（循环

建议：

$(function(){
   var images = [
       'bg_home.jpg',
       'bg_home2.jpg',
       'bg_home3.jpg',
       'bg_home4.jpg' 
   ],
   loop = 0,
   $home = $('.home');

   (function fader(){
        $home
        .fadeOut('fast', function(){
            $home.css('background', '#000000 url(' + images[loop] + ') top center no-repeat');
            $home.fadeIn('fast', function(){
                 setTimeout(fader, 3000);
            });
        });

        if(loop < images.length) 
           loop++;
        else loop = 0;                
    })();         
});

$（函数（）{
变量图像=[
“bg_home.jpg”，
“bg_home2.jpg”，
“bg_home3.jpg”，
“bg_home4.jpg”
],
循环=0，
$home=$（“.home”）；
（功能推子（）{
$home
.fadeOut（'fast'，function（）{
$home.css（'background'，'000000URL（'+images[loop]+'）顶部中间不重复）；
$home.fadeIn（'fast'，function（））{
设置超时（音量控制器，3000）；
});
});
if（循环

非常感谢！它确实做了一些事情，尽管不完全正确。现在发生的事情是，图像显示约一毫秒，逐渐变为黑色。然后“图像”（虽然是黑色）正在褪色。@Mathijs：应该可以，我在这里创建了一个示例：是的，确实可以！我只需要稍微调整一下。谢谢只有一件事：中间有一个黑色图像，一个叫做“未定义”的图片。@Mathijs：应该是因为我创建了一个小bug。应该是

if语句中的
images.length-1
。是的，我自己算出来了：-）谢谢你的帮助，真的！非常感谢你！它确实做了一些事情，尽管不完全正确。现在发生的事情是，图像显示约一毫秒，逐渐变为黑色。然后“图像”（虽然是黑色）正在褪色。@Mathijs：应该可以，我在这里创建了一个示例：是的，确实可以！我只需要稍微调整一下。谢谢只有一件事：中间有一个黑色图像，一个叫做“未定义”的图片。@Mathijs：应该是因为我创建了一个小bug。应该是
if语句中的
images.length-1
。是的，我自己算出来了：-）谢谢你的帮助，真的！