微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

jQuery Slick轮播版式不适用于移动版式

如何解决jQuery Slick轮播版式不适用于移动版式

我正在尝试使用以下代码将Slick幻灯片设置为在中心模式下显示

// slider
$('.slider-inner').slick({
    centerMode: true,centerPadding: '260px',dots: 0,slidesToShow: 1,responsive: [
        {
            breakpoint: 768,settings: {
                arrows: false,centerMode: true,centerPadding: '40px',slidesToShow: 1
            }
        },{
            breakpoint: 480,slidesToShow: 1
            }
        }
    ]
});

桌面布局

在下面,您可以看到它在我的桌面布局上的外观,几乎完全是我想要的样子(显示了一张照片,另外两张被剪掉了):

enter image description here

平板电脑布局

但是,尽管我在代码中设置了responsive选项,但是当我以768px宽观看时,却得到了3张与标准轮播一样的图像。我发现,无论我在responsive选项中设置了什么值,它对平板电脑的布局都没有影响

但是,如果我更改了认选项(例如,对于桌面版式),则会对移动版式产生影响:

enter image description here

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。