@Heinsed
Junior Front-end developer

Slick Slider Syncing Multiple | Как сделать отображение двух слайдов одновременно?

Приветствую! Столкнулся с проблемой. Мне нужна реализация слик-слайдера через его возможность Slider Syncing, но отображая не один slide, а два одновременно (slidesToShow: 2 - on .slider-for).
<div class="good__photo-showcase">
                                <div class="slider-for">
                                    <div class="item">
                                        <img src="img/img.jpg" alt="image"  draggable="false"/>
                                    </div>
                                    <div class="item">
                                        <img src="img/img.jpg" alt="image" draggable="false"/>
                                    </div>
                                    <div class="item">
                                        <img src="img/1.jpg" alt="image" draggable="false"/>
                                    </div>
                                    <div class="item">
                                        <img src="img/img.jpg" alt="image" draggable="false"/>
                                    </div>
                                    <div class="item">
                                        <img src="img/img.jpg" alt="image" draggable="false"/>
                                    </div>
                                </div>
                                
                                <div class="slider-nav">
                                    <div class="item">
                                        <img src="img/img.jpg" alt="image"  draggable="false"/>
                                    </div>
                                    <div class="item">
                                        <img src="img/img.jpg" alt="image" draggable="false"/>
                                    </div>
                                    <div class="item">
                                        <img src="img/1.jpg" alt="image" draggable="false"/>
                                    </div>
                                    <div class="item">
                                        <img src="img/img.jpg" alt="image" draggable="false"/>
                                    </div>
                                    <div class="item">
                                        <img src="img/img.jpg" alt="image" draggable="false"/>
                                    </div>
                                </div>

                            </div>

$('.slider-for').slick({
  slidesToShow: 1,  // здесь нужно отобразить два блока одновременно
  slidesToScroll: 1,
  arrows: false,
  fade: true,
  asNavFor: '.slider-nav',
	 autoplay: true
});
$('.slider-nav').slick({
  slidesToShow: 3,
  slidesToScroll: 1,
  asNavFor: '.slider-for',
  arrows: false,
  dots: false,
  centerMode: true,
  focusOnSelect: true,
  vertical: true

});


Задавал параметр slidesToShow: 2, но ничего не работает, слайдер ломается полностью.

Заранее благодарю за помощь.
  • Вопрос задан
  • 19 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы