Multiple jCarousels with scroll buttons created by callback.

Question

I have a page where I'm trying to add several jCarousel elements. One of these on its own works very nicely with the following code:

function mycarousel_initCallback(carousel) {        
    jQuery('.next').bind('click', function() { carousel.next(); return false; });
    jQuery('.prev').bind('click', function() { carousel.prev(); return false; });
        };

// Load carousel...
jQuery(document).ready(function() {
jQuery(".featuredItems").jcarousel({
    scroll: 4,
    visible: 4,
    initCallback: mycarousel_initCallback,
    buttonNextHTML: null,
    buttonPrevHTML: null
  });

});

However if I add more than one to a page - the forward/back buttons control all carousels not just the one I want. I've tried messing around with "this" to isolate the carousel element I want to change, but this doesn't seem to work.

score 0 · Accepted Answer · answered Aug 24 '12 at 16:44

0

The only way I was able to get this working was to have a separately named callback function and differently named previous and next button div classes.

answered Aug 24 '12 at 16:44

DaveR

2,355
1
19
36

Multiple jCarousels with scroll buttons created by callback.

1 Answers1