Slick Carousel, игнорируя отзывчивые точки останова ⇐ Jquery

[Anonymous]

Я строю карусель, используя Slick, и у меня есть некоторые отзывчивые точки останова, как видно здесь: < /p>
var slidesNumber = $('.aslide').length;
var options = {
rows: (slidesNumber > 3 ? 2 : 1),
slidesPerRow: 3,
slidesToShow: (slidesNumber > 3 ? 1 : 3),
slidesToScroll: 1,
dots: true,
arrows: false,
dotsClass: 'slick-dots slick-dots-black',
adaptiveHeight: true,
responsive: [
{
breakpoint: 1280,
settings: {
slidesPerRow: 2,
slidesToShow: 1,
slidesToScroll: 1,
rows: 2,
}
},
{
breakpoint: 768,
settings: {
slidesPerRow: 1,
slidesToShow: 1,
slidesToScroll: 1,
rows: 1,
}
}
]
}

$('.slider').slick(options);
< /code>
Тем не менее, Slick полностью игнорирует точку останова 768px и отображает 2 ряда по 2 слайдам каждый вместо 1 строки 1 слайда. Вот JSFIDDLE.
Я посмотрел здесь и здесь. < /p>
Я тоже смотрел другие посты, но пока не нашел решения. < /p>
Редактировать 1: < /p>
Также замечено в jsfiddle, если вы загружаете страницу шириной окна менее 768px, он показывает 3 слайда в 2 рядах, но если вы изменяете размер вверх и вниз, он снова начинает показывать 2 слайда в 2 рядах.


Подробнее здесь: https://stackoverflow.com/questions/631 ... reakpoints