dynamic carousel with jcarousel

Question

I have been scratching my head here for hours now, trying to use jcarousel with a dynamic generated content, meaning , i get an initial carousel , say , with 3 items in it, and then adding another item to the carousel.

im doing it basically like this :

$('.actorslider .slides').jcarousel('add', index, html);

problem is , the index is dynamic and when a user clicks "next" on the initial carousel i dont know what is the next index i should use , and when im trying to count the elements or increment the last one the carousel just doubles up .

you can see what i mean here

press the button under the image once and then the mess starts.

any ideas ?

Answer 1

I'm sure there's a neater way of achieving your goal, however in the meantime, you could always create a global index variable like

var $i;

and increment it each time you load a slide dynamically.

$i++;

If you remove all slides, reset your counter.

$i=0;