2 行猫头鹰旋转木马或 BX 滑块
Posted
技术标签:
【中文标题】2 行猫头鹰旋转木马或 BX 滑块【英文标题】:2 Rows Owl Carousel or BX Slider 【发布时间】:2016-04-13 23:30:52 【问题描述】:是否可以使用 Owl Carousel 或 BX Slider 在桌面上制作 2 行滑块并在移动屏幕上变为 1 行?我已经尝试了一些,但在移动设备上仍然是 2 行。你能帮忙吗?
【问题讨论】:
【参考方案1】:这是猫头鹰轮播2的解决方案,可以控制盒子数量:
$(document).ready(function()
$('.owl-carousel').owlCarousel(
autoplay:true,
responsive:
0:
items: 1
,
600:
items: 2
,
1000:
items: 3
);
);
这个想法是声明你需要多少不同宽度的盒子。
【讨论】:
非常感谢【参考方案2】:$('.carousel').slick(
rows: 2,
dots: true,
arrows: false,
infinite: true,
speed: 300,
slidesToShow: 4,
slidesToScroll: 4,
responsive: [
breakpoint: 640,
settings:
rows: 1,
slidesToShow: 1,
slidesToScroll: 1,
infinite: true,
dots: true
]
);
【讨论】:
以上是关于2 行猫头鹰旋转木马或 BX 滑块的主要内容,如果未能解决你的问题,请参考以下文章