Почему появляется резкий переход от последнего слайда к первому в Slick Slider?

Привет!
Столкнулся с проблемой, делаю простой слайдер при помощи Slick Slider и наблюдаю резкий скачек от последнего слайда к первому если ставить режим infinite: true.

63f9afe846891119944568.gif

Прикрепляю codepen


Если на сами слайды нажимать то все ок, если стрелками переходить то видно как на последнем слайде происходит рывок анимации. Скорее всего это происходит из за того что удаляются slick-clone слайд и приисваивается slick-current активному слайду (уже не клону), но как это избежать?
  • Вопрос задан
  • 183 просмотра
Пригласить эксперта
Ответы на вопрос 1
@VyacheslavY Автор вопроса
Нужно добавить следующие свойства:

/* slide when not active/center*/ .slick-slide[aria-hidden="true"]:not(.slick-cloned) ~ .slick-cloned[aria-hidden="true"] { 
  transform: translate(0px, 50px);
}

/* slide when active/center */ 
.slick-slide[aria-hidden="true"]:not([tabindex="-1"]) + .slick-cloned[aria-hidden="true"] { 
  transform: translate(0px, 0px);
}

/* slide when active (when play first to last) */ 
.slick-slide[aria-hidden="true"] + .slick-cloned[aria-hidden="true"] {
  transform: translate(0px, 0px);
}


Правда теперь появляется баг если нажать на третий слайд, анимация с рывком, но это я просто отключу focusOnSelect пока что...
Ответ написан
Комментировать
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы