слайдер idangero.us текущий слайд и максимальный слайд

Question

слайдер idangero.us текущий слайд и максимальный слайд

0

Я использую слайдер idangero.us(http://www.idangero.us/sliders/swiper/index.php) для отображения нескольких изображений. Когда вы наводите курсор на изображение, я показываю DIV, который говорит "Image X of X". Такие работы, но общее количество всегда ошибочно. Мой javascript-код

var mySwiper = new Swiper('.swiper-container',{
    mode:'horizontal',
    loop: true,
    speed: 600,
    autoplay: 5000,
    autoResize: true,
    preventLinks: true,
    calculateHeight: true,
    grabCursor: true,
    pagination: '.pagination',
    paginationClickable: true,
    onSlideChangeEnd: function () { 
       $(".start_index").html(mySwiper.activeIndex)
    }
})

$(".start_index").html("1")
$(".end_index").html(mySwiper.slides.length)

В моем div-контейнере swiper у меня есть следующее, которое должно обновляться по мере перемещения слайдов:

<div class="ImageIndex">
    Image <span class="start_index">2</span> of <span class="end_index">3</span>
</div>

Кто-нибудь сделал что-нибудь подобное, что могло бы помочь?

user1024941 13 нояб. 2013, в 06:58

Источник

0

Теперь это mySwiper.activeIndex
dude 15 авг. 2016, в 09:40

Теги:

jquery

1 ответ

Ещё вопросы

user3715723 · Answer 1 · 2014-10-04T08-11-00.000Z

var pressSwiper = new Swiper('.press-container', {
    mode : 'vertical',
    slideClass : 'press-slide',
    wrapperClass : 'press-wrapper',
    calculateHeight : true,
    watchActiveIndex: true,
    onSlideChangeEnd: function () { 
        $(".presSlidesActive").text(pressSwiper.activeIndex +1);
    }
});



$( ".pressArrow.prev" ).click( function() { pressSwiper.swipePrev();   });
$( ".pressArrow.next" ).click( function() { pressSwiper.swipeNext();   });

$(".presSlidesActive").text("1");
$(".presSlidesFrom").text(pressSwiper.slides.length);

$( ".pressArrow.veryPrev" ).click( function() { pressSwiper.swipeTo(0);   });
$( ".pressArrow.veryNext" ).click( function() { pressSwiper.swipeTo(pressSwiper.slides.length-1);   });