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

Question

[Вячеслав Яшников]

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



Прикрепляю codepen


Если на сами слайды нажимать то все ок, если стрелками переходить то видно как на последнем слайде происходит рывок анимации. Скорее всего это происходит из за того что удаляются slick-clone слайд и приисваивается slick-current активному слайду (уже не клону), но как это избежать?

Answer 1

[Вячеслав Яшников]

Нужно добавить следующие свойства:

/* 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 пока что...