본문 바로가기
jquery

[bxslider.js] current, total index값 얻기

by 바나냥 2020. 4. 6.
         var mainSlider = $('.mainSlide > .slider').bxSlider({
                auto: true,
                pause: 2000,
                pager: false,
                controls: true,
                autoControls: true,
                stopAutoOnClick: true, //prev, next 누르면 stop됨
                autoControlsCombine: true,
                autoControlsSelector: '#main-control .stop',
                prevSelector: '#main-control .prev', 
                nextSelector: '#main-control .next',
                infiniteLoop: true,
                onSlideBefore: function ($slideElement, oldIndex, newIndex){
                 var current_index = parseInt(newIndex + 1);
                 if(current_index > 8){
                 $('#main-counter .current').text(current_index);
                 }else{
                 $('#main-counter .current').text('0' + current_index);
                 };
                }
            });
         if(mainSlider.getSlideCount() > 9){
         $('#main-counter .total').text(mainSlider.getSlideCount());
         }else{
         $('#main-counter .total').text('0' + mainSlider.getSlideCount());
         };




        <div class="mainSlide">
            <ul class="slider">
                <li class="main_visual01">메인이미지 1</li>
                <li class="main_visual02">메인이미지 2</li>
                <li class="main_visual03">메인이미지 3</li>
            </ul>
            <div id="main-control" class="outside">
             <div class="outside-wrap">
                 <span class="prev"></span><span class="stop"></span><span class="next"></span>
                </div>
            </div>
            <div id="main-counter">
             <span class="current">01</span> / <span class="total"></span>
            </div>
        </div>

댓글