title: making container div background slide
body: <p><p>I have a header div that contains menu div,logo div  and some text.I wanna make a slide show.I tried JQuery fadeIn() and fadeOut() functions , but when I used the fadeOut() method, all of header content(menu div,logo div etc...) is effected.I wrote a JavaScript function to change the header div's background-image but this time ,it is not like a slide show,it is like a gif image.I need to make a slide with slow passing between images.</p>My code is here</p>
  
  <pre>
  
  
          
              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);
  
          
  
  </pre>