Есть slick-слайдер с параметрами slidesToShow: 3, slidesToScroll: 1
. Если слайдов больше трёх, то всё работает корректно:
$('.slider').slick({
infinite: true,
speed: 1500,
slidesToShow: 3,
slidesToScroll: 1
})
.slide {
padding: 30px;
border: 1px solid red;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/[email protected]/slick/slick.css"/>
<script type="text/javascript" src="//cdn.jsdelivr.net/npm/[email protected]/slick/slick.min.js"></script>
<div class="slider">
<div class="slide">1</div>
<div class="slide">2</div>
<div class="slide">3</div>
<div class="slide">4</div>
</div>
Но если оставить только три слайда, пропадают элементы управления и прокрутка блокируется:
$('.slider').slick({
infinite: true,
speed: 1500,
slidesToShow: 3,
slidesToScroll: 1
})
.slide {
padding: 30px;
border: 1px solid red;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/[email protected]/slick/slick.css"/>
<script type="text/javascript" src="//cdn.jsdelivr.net/npm/[email protected]/slick/slick.min.js"></script>
<div class="slider">
<div class="slide">1</div>
<div class="slide">2</div>
<div class="slide">3</div>
</div>
Можно ли заставить slick-слайдер прокручивать то количество слайдов, которое дано к показу? Или придётся использовать другой слайдер?