How to make a continuous scroll with JQuery?

Question

Hi Guys,

I have this site I am developing: http://tinyurl.com/l7uzzp - I made the scroller with the following code:

$(document).ready(function()
{
      function scrollIt()
      {
         $('#featured-brands div#scroll').animate({
            marginLeft: "-4550px"}, 85000, "linear").animate({ 
               marginTop: "-223px" }, 200, "linear").animate({ 
                  marginLeft: "750px" }, 100, "linear").animate({ 
              marginTop: "57px" }, 1, "linear", scrollIt);
      }
      scrollIt();
});

When the final image is sliding across, there is a white blank space visible, how would I make the first image appear right after the final image, so there is no white space?

Cheers, Keith

Answer 1

split it into two. When one goes off the bottom, move it so it's above the other.