Если у вас перестает работать слайд (не работает карусель), когда 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>
После наша карусель будет работать идеально.
Добавить комментарий