user555600
user555600

Reputation: 164

how to change the number of scroll when click next/prev button in JCAROUSEL

my scroll option is set to "1" and wrap to 'circurlar' but when i change the scroll option in the next/prev button to 4 automatically the carousel scroll to 4 how do i make it not adopt the set value on next/prev button

HERES MY CODE:

$('#news-carousel').jcarousel({ 
                vertical: true, 
                scroll: 1, 
                auto: 2, 
                wrap: 'circular',
                initCallback: function(jc,state) {
                  if (state == 'init') {
                    jc.startAutoOrig = jc.startAuto;
                    jc.startAuto = function() {
                      if (!jc.paused) {
                        jc.startAutoOrig();
                      }
                    }
                    jc.pause = function() {
                      jc.paused = true;
                      jc.stopAuto();
                    };
                    jc.play = function() {
                      jc.paused = false;
                      jc.startAuto();
                    };
                    $('li.jcarousel-item').click(function(){ 
                        jc.pause();
                    });
                    $('a.close').click(function(){ 
                        jc.play();
                    }); 
                    jc.play();
                      }
                    },
                    buttonNextCallback: function(jc,state){
                        $('.arrow-up').bind('click',function() {
                            jc.next();
                                jc.options.scroll = jQuery.jcarousel.intval(4)
                            return false;
                            });
                    },
                    buttonPrevCallback: function(jc,state){
                        $('.arrow-down').bind('click',function() {
                            jc.prev();
                            jc.options.scroll = jQuery.jcarousel.intval(4)
                            return false;
                        });
                    }
            }); 

Upvotes: 0

Views: 2772

Answers (1)

Hazza
Hazza

Reputation: 6591

Didn't really understand your question completely I think...

function changeScroller() {
        jQuery('.jcarousel-control a').bind('click', function () {
            var carousel = jQuery('#mycarousel').data('jcarousel');
            carousel.options.scroll = jQuery.jcarousel.intval(jQuery(this).text());
            return false;
        });
    }

jQuery('#mycarousel').jcarousel({
            visible: show,
            scroll: 2,
            initCallback: changeScroller
        });

<div class="jcarousel-control" style="float:right">
<a href="#" class="button">2</a>
<a href="#" class="button">5</a>
<a href="#" class="button">10</a>
</div>

Clicking a button changes how many items the next scroller will scroll through, defaulting as 2

Upvotes: 2

Related Questions