Auto scroll horizontally using jquery in image gallery?

Question

Ok so I am making an Image Gallery. I laid thumbnails horizontally in a div under the big pictures. img this is a snapshot of it.

I want the thumbnails div to scroll with the big pictures as the user clicks on the next button. I have tried

$("#next").click(function({$(".slider_thumbnail").animate({scrollLeft: 300px})});

but this just works first time and doesn't work second time when user clicks on next button.

Answer 1

I think there is a problem with scrollLeft: 300px . When you use this property, the element will be moved to the absolute scroll position of 300px at first time, and when you click next button again, it will not move because i already has the same scroll position. You should use scrollLeft: "+=300" for continuous working. Please take a look at http://api.jquery.com/animate/