Если у вас перестает работать слайд (не работает карусель), когда slidesToShow равняется количеству слайдов, то вам необходимо клонировать дополнительный элемент слайда. Допустим есть следующий код:
<div class="slider" id="slider">
<div>Element 1</div>
<div>Element 2</div>
<div>Element 3</div>
</div>
<script>
$('.slider').slick({
slidesToShow: 3,
slidesToScroll: 1,
infinite: !0,
arrows: !0,
dots: !1,
adaptiveHeight: !1,
centerMode: !0,
});
</script>
Необходимо добавить к первому элементу слайда класс. Это делается для того, чтобы мы могли клонировать элемент. Вставляем перед запуском кода для слайда, код с клонированием.
<div class="slider" id="slider">
<div class="forClone">Element 1</div>
<div>Element 2</div>
<div>Element 3</div>
</div>
<script>
// Клонируем элемент с классом forClone
let parent = document.getElementById('slider');
let elem = parent.querySelector('.forClone');
let clone = elem.cloneNode(true);
parent.appendChild(clone);
$('.slider').slick({
slidesToShow: 3,
slidesToScroll: 1,
infinite: !0,
arrows: !0,
dots: !1,
adaptiveHeight: !1,
centerMode: !0,
});
</script>
После наша карусель будет работать идеально.

Добавить комментарий