这是我用来在我的网页上创建slick carousel的配置。
$('#carousel').slick({
infinite: true,
slidesToShow: 3,
slidesToScroll: 1,
arrows: true,
autoplay: true,
autoplaySpeed: 2000,
responsive: [
{
breakpoint: 1200,
settings: {
slidesToShow: 2,
slidesToScroll: 1
}
},
{
breakpoint: 1008,
settings: {
slidesToShow: 1,
slidesToScroll: 1
}
},
{
breakpoint: 800,
settings: "unslick"
}
]
});
除了一件事,当我调整我的浏览器窗口的大小,从1920宽到800宽时,旋转播放器就会消失,内容就像普通的div一样显示,但是当我增加浏览器窗口的宽度时,旋转播放器就不会重新创建。它仍然像没有carousel的HTML div块。
如有任何帮助,我们将不胜感激。
unslick是一个析构函数方法。一旦取消slick,就需要再次调用slick()来构造carousel。
这是unslick在断点处杀死旋转木马后重建旋转木马的一种方法:
$(window).resize(function () {
$('.js-slider').not('.slick-initialized').slick('resize');
});
$(window).on('orientationchange', function () {
$('.js-slider').not('.slick-initialized').slick('resize');
});