How to get the current index with jCarousel Lite?

问题:

I'm using jCarousel Lite and need to get the current index (which element is being displayed as I'm only showing one item at a time) so I can add a "current" class to the navigation link.

Does anybody know how I can accomplish this?

http://www.gmarwaha.com/jquery/jcarousellite

回答1:

From the documentation at the link you posted:

afterEnd Callback function that should be invoked after the animation ends. The elements representing the items that are visible after the animation ends are passed in as argument.

So, create a function that sets your "current" class, and pass it as the afterEnd option when you create the carousel.

回答2:

First download the uncompressed version of jCarousel Lite and open it. Go to line 288*, or anywhere below the o.beforeStart.call(), and add the following:

li.removeClass("current");

Next go to line 313*, anywhere below the ul.animate();, or even within the animate() callback and add the following:

li.eq(curr).addClass("current");

That's it for the jCarousel Lite modifications. Save the file / upload the changes.

Finally you'll want to set the current class once the page loads. For that use:

$(".jCarouselLite li").eq(0).addClass("current");

or

$(".jCarouselLite li:first").addClass("current");

*Note to future readers: This change is for v1.0.1. The actual line number may vary.