Cycle jQuery plugin, can the images slide both ways intuitively?

Question

I'm using the jQuery cycle plugin found here: http://jquery.malsup.com/cycle/

It works well. My client wants a list of <div>s that contain images and text, etc. to slide horizontally on the front page. But she also wants me to use the previous and next options to have arrows on either side that can control the sliding panels.

Here is the jQuery plugin call I'm using:

$('#slidingpanelscontent').cycle({ 
    fx: 'scrollLeft',
    next: "#sliding_next",
    prev: "#sliding_prev",
    timeout: 6000,
    speed: 800
});

It works for the most part. When you click the right arrow (#sliding_next), the current panel scrolls off to the left to reveal the next panel. However, when you click the left pointing arrow (#sliding_prev), the current panel still scrolls off to the left to reveal the previous image.

In other words, the correct image is displayed, but the animation is counter-intuitive and would lead a user to believe that the NEXT panel is being displayed, rather than moving back to the previous panel.

Anyone know a way of overcoming this using this plugin?

Answer 1

I'm not sure if the cycle plugin can accomplish this but I recently viewed a tutorial that does what you want. It's called an "infinite carousel".

See this infinite carousel tutorial for details.

Edit: Have you seen this demo which appears to have the functionality you described? http://jquery.malsup.com/cycle/add6.html