jQuery Cycle: Scroll back to the first slide after the last slide

I have a slider that looks like this:

$('#slider').cycle({
    fx: 'scrollHorz',
    speed: 1250, 
    timeout: 5000,
    easing: 'easeInOutExpo',
    pager: '#slider-pagination',
    next: '#next-slide',
    prev: '#prev-slide',
    pause: 1
});

By default, when it's on the last slide Cycle just scrolls to the left again to start over, as though it's an infinite loop. I want it to scroll back through all the slides and land on the first one again. Much like it 开发者_Go百科does here (see the last slide): http://www.iconlicious.com/. I must use Cycle, so I can't use the same plugin as they are.

How can that be achieved?

Thanks

The solution is to set the nowrap option to false.

While I can't test anything, you probably will have to use the end option to define a function to return to the beginning.

So, something like:

$('#slider').cycle({
    fx: 'scrollHorz',
    speed: 1250, 
    timeout: 5000,
    easing: 'easeInOutExpo',
    pager: '#slider-pagination',
    next: '#next-slide',
    prev: '#prev-slide',
    pause: 1
    nowrap: false, 
    end: function() { 
        // make it go to the first slide
    }
});

Use the not documented 'bounce' option:

$('#slider').cycle({
  fx: 'scrollHorz',
  speed: 1250, 
  timeout: 5000,
  easing: 'easeInOutExpo',
  pager: '#slider-pagination',
  next: '#next-slide',
  prev: '#prev-slide',
  pause: 1,
  bounce: true
});

Hope this helps

Looking at your website, I can tell you already solved your problem, but I wanted to post this in case there were others who might find it valuable.

You used jquery.scrollable, which is a great solution and solved the same issue for me.