SlavaMaxwell
@SlavaMaxwell
Frontend разработчик

Как переназначить настройки слайдера после срабатывания клика на кнопку?

Слайдер на Swiper.js
Идея такова, есть кнопка старт/стоп у слайдера, при клике на стоп конкретный слайд у меня останавливается, а при клике на старт когда он начинает запускаться он ждет 4500 сек, чтобы перелистнуть следующий слайд, а не сразу как только я нажал старт он перелистнулся, понятно , что эти 4500 это задержка, ранее настроенная в настройках слайдера, как это пофиксить, я думаю только переназначить delay там в 300 и потом в if снова его переназначать в 4500 или есть какие то еще идеи? вопрос в том как обратиться мне к delay и указать конкретное число?

$(function(){
  var sliderBannerInfo = new Swiper('.js-swiper-banner', {
    slidesPerView: 1,
    speed: 600,
    loop: true,
    autoplay: {
      delay: 4500,
    },
    loopFillGroupWithBlank: true,
    navigation: {
      prevEl: ".swiper-button-prev.info__swiper-button-prev",
      nextEl: ".swiper-button-next.info__swiper-button-next",
    },
    pagination: {
      el: '.info__pagination-slider.swiper-pagination',
      clickable: true
    },
  });


  let stopSliderBtn = document.querySelector('.js-start-stop-slider')
  
  $(stopSliderBtn).on('click', startStopSlider);

  let flag = 1
  function startStopSlider(){
    if(flag == 1) {
      flag = 2
      sliderBannerInfo.autoplay.stop();
      $(stopSliderBtn).addClass('active-pause-slider');
      
    }
    else {
      flag = 1
      sliderBannerInfo.autoplay.start();
      $(stopSliderBtn).removeClass('active-pause-slider');

    }
  }
})
  • Вопрос задан
  • 238 просмотров
Решения вопроса 1
SlavaMaxwell
@SlavaMaxwell Автор вопроса
Frontend разработчик
метод destroy() всю ситуацию меняет
https://askto-pro.translate.goog/question/how-to-u...
else {
      flag = 1
      sliderBannerInfo.autoplay.start();
      $(stopSliderBtn).removeClass('active-pause-slider');


      sliderBannerInfo.destroy()
      sliderBannerInfo = new Swiper('.js-swiper-banner', {
        autoplay: {
          delay: 500,
        }, 
      });
    }
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы