制作容器div背景幻灯片

Question

我有一个标题div，包含菜单div，logo div和一些文本。我想做一个幻灯片放映。我尝试了JQuery fadeIn（）和fadeOut（）函数，但是当我使用了fadeOut（）方法，所有标题内容（菜单div，logo div等）都受到影响。我写了一个JavaScript函数来改变标题div的背景图像，但这一次，它不像幻灯片放映，它是就像一个gif图像。我需要制作一张在图像之间传递缓慢的幻灯片。

我的代码在这里

        
            var imageArray = new Array();
            var switchMilliseconds = 5000;

            // Specify the id of the div or other HTML tag with the 
            //   background image to switch.

            var divID = "header";

            // To add more images, continue the pattern below.

            imageArray[0] = 'images/header_bg.png';
            imageArray[1] = 'images/1.jpg';
            imageArray[2] = 'images/header_bg.png';
            imageArray[3] = 'images/1.jpg';



            // No further customization needed in this JavaScript

            function publishPicture(i) {

                        document.getElementById(divID).style.background = 'url("' + imageArray[i] + '")';


                    i++;
                    if (i > (imageArray.length - 1)) { i = 0; }
                    setTimeout('publishPicture(' + i + ')', switchMilliseconds);

            }

            publishPicture(0);