У slick слайдера если количество элементов меньше или столько же сколько должно отображаться, то скрываются стрелки и перестает работать автоматическая прокрутка, как это реализовать?
Пример на codepen.io
То что исчезают стрелки это не критично, но то что прокрутка больше не работает очень плохо.
Так как использую сдвоенный слайдер slick, если нет автоматической прокрутки у дотсов(второй слайдер) то не прокручивается и основной
Пример js, если выставить количество отображаемых слайдов 3(количество больше или равно сумме слайдов) то автопрокрутка отключится
$(document).ready(function(){
$('.slidder1').slick({
slidesToShow: 1,
slidesToScroll: 2,
asNavFor: '.slidder2',
});
$('.slidder2').slick({
slidesToShow: 2,
slidesToScroll: 1,
asNavFor: '.slidder1',
dots: true,
autoplay: true,
autoplaySpeed: 2000,
});
});
Согласен что решение очень топорное, но работает.
Смотрим на количество слайдов у слайдера отвечающего за навигацию и если их меньше заданного отменяем возможность улетать в бока, а раз не ломается этот слайдер то без проблем ставим автопрокрутку к первому.
JS
$('.slider-front-nav').on('setPosition', function(event, slick){
var length_slid = $('.slider-front-nav .slider-front-nav-unit.slick-slide').length;
if (length_slid <= 4) {
$('.slider-front-nav').addClass("stop-transform");
}else{
$('.slider-front-nav').removeClass("stop-transform");
}
});
CSS
.slider-front-nav.stop-transform .slick-track {
transform: translate3d(0px, 0px, 0px) !important;
}
Апостиль в Лос-Анджелесе без лишних нервов и бумажной волокиты
Основные этапы разработки сайта для стоматологической клиники
Продвижение своими сайтами как стратегия роста и независимости