Индекс и общее количество слайдов зацикленного слайдера Swiper при отображении при нажатии кнопки - PullRequest
0 голосов
/ 18 марта 2019

У меня есть ползунок Swiper в модале Bootstrap 4, который отображается при нажатии кнопки.

Индекс текущего ползунка, полученный с помощью realIndex, остается тем же для первогодва слайда, когда отображается модал и слайд изменяется на 1, и затем он увеличивается должным образом при дальнейшем изменении слайдов.Вот скрипка, показывающая проблему - https://jsfiddle.net/vinravun/2z6agh4x/

Что я здесь не так делаю?Какое событие Swiper я должен прослушивать и как правильно его инициализировать с включенным свойством «loop» ползунка?

    var swiper = new Swiper('.swiper-container', {
            direction: 'horizontal',
      loop: true,
      slidesPerView: 1,
      speed: 500,
      centeredSlides: true,
      observer: true,
      observeParents: true,
      navigation: {
        nextEl: '.swiper-button-next',
        prevEl: '.swiper-button-prev',
      },
    });

    var currentIndex,
            slidesCount;

    $('#myModal').on('shown.bs.modal', function (e) {
      currentIndex = swiper.realIndex + 1;
      slidesCount = swiper.slides.length - 2;
      updateCounter();
   });

    swiper.on('transitionEnd', function() {
       currentIndex = swiper.realIndex + 1;
       updateCounter();
    });

    function updateCounter() {
       $('.current-slide').html(currentIndex);
       $('.total-slides').html(slidesCount);
    }
...