본문 바로가기
jquery

[bxslider.js] 3개 출력 슬라이드 소스

by 바나냥 2020. 4. 6.
photoSlide = $('.menuSlide .slide').each(function(index){
                var $thisObj = $(this);
                var totalCount = new Array();
                totalCount[index] = $thisObj.find('li').length;
                var totalN = totalCount - 1;
                var prev = $(this).parent().find(".prev2");
                var next = $(this).parent().find(".next2");
                var pager = $(this).parent().find(".pager");
                $thisObj.bxSlider({
                    auto: false,
                    pager: false,
                    //pagerType: 'short',
                    controls: true,
                    minSlides: 3,
                    maxSlides: 3,
                    moveSlides: 1,
                    /* slideWidth: 610,
                    slideHeight: 500,
                    slideMargin: 80, */
                    startSlide: totalN,
                    prevSelector: prev,
                    nextSelector: next,
                    pagerSelector: pager,
                    onSlideNext: function($slideElement, oldIndex, newIndex) {
                        $('.menuSlide .slide li').removeClass('active');
                        $('.menuSlide .slide li').eq(newIndex+4).addClass('active');
                    },
                    onSlidePrev: function($slideElement, oldIndex, newIndex) {
                        $('.menuSlide .slide li').removeClass('active');
                        $('.menuSlide .slide li').eq(newIndex+4).addClass('active');
                    },
                    onSliderLoad: function(currentIndex){
                        $('.menuSlide .slide li').removeClass('active');
                        $('.menuSlide .slide li').eq(currentIndex+4).addClass('active');
                    },
                    onSlideBefore: function ($slideElement, oldIndex, newIndex){
                     var current_index2 = parseInt(((newIndex+1)%(totalN+1)) + 1);
                     $('#main-counter2 .current').text(current_index2);
                    }
                });
                $('#main-counter2 .total').text(totalCount);




<span class="pager" id="main-counter2"><span class="current">1</span>/<span class="total"></span></span>

댓글