title: Manual background div slideshow
body: <p>I need to make a css background image fade slideshow. For several reasons, i cannot have a physical div in my html. It's the body with a class called -home- that has a current background. There will be 4 pictures for the slideshow, no more, no less, so that doesn't have to dynamic.</p>
  
  <p>I already have the following jquery:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  $(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);
      });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>So, as you see this is a very simple script that only works if i click the general -home- div. Can anyone help me with transforming this into a simple fade slideshow without any click? It should just start executing the fade slideshow onload.</p>
  
  <p>Thank you very much!</p>