Question

The next button is enabled even though there are no items in the carousel, and it seems as if JCarousel thinks it has infinite items, because when I click the next, it actually scrolls.

I want to disable the ‘next’ when there are no items in the Carousel.

The Carousel works perfectly when there are items in the carousel btw!
I have absolutely no experience with JQuery, only some javascript.

This is what I have:

jQuery(document).ready(function() {
    jQuery('#mycarousel').jcarousel({
        scroll:4

    });
});

I think I should use initCallback somehow, but as I said, I have no experience with JQuery at all. BTW here is all JCarousel parameters and I think, how to set them.

Hopefully somebody out there will help me.

Thanks

Answer 1

I believe you’re correct in that initCallback is what you want. You’d want to put some sort of test to see if the list has any items in it, like:

initCallback: function(carousel, state){
    if($(carousel).find('li').length == 0){
       $('#next').attr('disabled', true);
    }else{
       $('#next').attr('disabled', false);
    }
}

You also may want to check out the buttonNextCallback and buttonPrevCallback carousel functions, which would again allow you to enable or disable the next and previous “buttons” if the current li is the :last or :first, respectively.