@WebforSelf

Почему slick слайдер показывает 2 слайд?

Есть сайт ТЫЦ

Если добавить в корзину и посмотреть в мобильной версии, то там этапы заказа разбиты на слайды slick

Скрипт инициализации slick

var currentSize = $(window).width();
 
  var sliderMobile = function sliderMobile() {
    if (currentSize < 641) {
      $('.booking').not('.slick-initialized').slick({
        responsive: [{
          breakpoint: 9999,
          settings: "unslick"
        }, {
          breakpoint: 640,
          settings: {
            slidesToShow: 1,
            speed: 500,
            dots: false,
            arrows: false,
            touchMove: false,
            infinite: false,
            adaptiveHeight: true
          }
        }]
      });
    }
  };

  sliderMobile();
  $(window).resize(function () {
    var currentSize = $(window).width();
    sliderMobile();
    return currentSize;
  });
  $('.js-booking-nav__next').click(function () {
    $(".booking").slick('slickNext');
  });
  $('.js-booking-nav__prev').click(function () {
    $(".booking").slick('slickPrev');
  });
  $('.booking').on('init reInit afterChange', function (event, slick, currentSlide, nextSlide) {
    var i = (currentSlide ? currentSlide : 0) + 1;
    $("html, body").animate({
    scrollTop: 0
    }, "slow");
    $('.step__el').each(function () {
      var current = $(this).index();
      console.log("current", current);

      if (current < i) {
        $(this).addClass("step__el--active");
      } else {
        $(this).removeClass("step__el--active");
      }

      if (current < i + 1) {
        $(this).addClass("step__el--active-border");
      } else {
        $(this).removeClass("step__el--active-border");
      }
    });

    if (i > 1) {
      $('.booking-nav').removeClass("booking-nav--start");
    } else {
      $('.booking-nav').addClass("booking-nav--start");
    }

    if (i > 3) {
      $('.booking-nav').addClass("booking-nav--end");
    } else {
      $('.booking-nav').removeClass("booking-nav--end");
    }
  }); // booking mobile === end



Только на мобильном инициируется, но не могу понять почему он захватывает часть следующих слайдов?
Центр мод не прописан.
5fe996c8c0c10016237238.png5fe996cfa3423982806399.png
5fe996d94a9e2089327885.png
  • Вопрос задан
  • 25 просмотров
Решения вопроса 1
daemonhk
@daemonhk
ПсиХоПат
1. Добавить параметр variableWidth:true
2. Задать ширину контента при необходимости
3. Полагаться на то, что слик нормально растянет контент, такое себе
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
Artezio Нижний Новгород
от 130 000 до 180 000 ₽
Intspirit Краснодар
от 80 000 до 150 000 ₽
Artezio Москва
от 160 000 до 220 000 ₽
28 янв. 2021, в 14:43
2490 руб./за проект
28 янв. 2021, в 14:38
5000 руб./за проект
28 янв. 2021, в 14:34
1500 руб./за проект