title: jquery - add animation to background image change
body: <p>I'm using a script that changes the background image of a div (class .hmcarousel) and carousels through 5 images - it seems to work OK. However I need to add an animated fade  effect to each transition (which at the moment is and immediate change) - but do not know what part of the function to add the animation script to. Many thanks for helping out.</p>
  
  <pre><code>jQuery(function ($) {
    var body = $('.hmcarousel');
    var backgrounds = new Array(
      "url(soml_slider_1.jpg)",
      "url(soml_slider_2.jpg)",
      "url(soml_slider_3.jpg)",
      "url(soml_slider_4.jpg)",
      "url(soml_slider_5.jpg)"
    );
    var current = 0;
    function nextBackground() {
      body.css(
        'background',
        backgrounds[current = ++current % backgrounds.length]
      );
      setTimeout(nextBackground, 5000);
    }
    setTimeout(nextBackground, 5000);
    body.css('background', backgrounds[0]);
  });
  </code></pre>