Question

ok so I have an image that I want to use as a background, but have it scroll like the image below.

Can anyone help me out with this or link me in the correct direction? Hopefully not parallax, unless you can help me out on how I can achieve this effect. I'm not asking for anyone to do it for me either, I just need some guidance.

Nevermind after probably 3 hours of continuous searching after posting this from searching and not finding what I was looking for I finally found what I was wanting to achieve. If anyone else needs help with this checkout this site - http://www.creativejuiz.fr/blog/doc/infinite-slideshow/

$(function(){
   setInterval(function(){
      $(".slideshow ul").animate({marginLeft:-350},800,function(){
         $(this).css({marginLeft:0}).find("li:last").after($(this).find("li:first"));
      })
   }, 3500);
});

http://imageshack.us/scaled/landing/191/slideshowmain.gif

Was it helpful?

Solution

If I'm not mistaken, you should clone it twice and put one clone before the original image and the other one after. Then animate the three of them and continuosly change their positions to simulate an infinite scroll. (I'll try to make a fiddle for you)

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top