javascript Owl-Carousel，一次滚动两个项目
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/32843347/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Owl-Carousel, scroll two items at a time
提问by jbehrens94
I am working on a slider with Owl-Carousel 2 (beta), but there is a lot that doesn't work well. I want the owlCarousel to work like this:
我正在使用 Owl-Carousel 2（测试版）制作滑块，但有很多效果不佳。我希望 owlCarousel 像这样工作：
It should scroll 2 items at a time, showing 2 items at a time. So: [0,1] slide[2,3] slide[4,5]
它应该一次滚动 2 个项目，一次显示 2 个项目。所以：[0,1]幻灯片[2,3]幻灯片[4,5]
On mobile, it should show one picture and scroll by 1 picture at a time.
在移动设备上，它应该显示一张图片并一次滚动一张图片。
owl = $('.owl-carousel')
owl.owlCarousel({
center: true,
loop: false,
margin: 20,
items: 2,
responsive: {
0: {
items: 1,
navigation: true,
nav: true
},
640: {
items: 2,
navigation: true,
nav: true
}
},
scrollPerPage: true,
navigation: true
}).css("z-index", 0)
回答by Turnip
You can use the slideByoption.
您可以使用该slideBy选项。
owl = $('.owl-carousel')
owl.owlCarousel({
center: true,
loop: false,
margin: 20,
items: 2,
responsive: {
0: {
items: 1,
navigation: true,
nav: true,
slideBy: 1 // <!-- HERE
},
640: {
items: 2,
navigation: true,
nav: true,
slideBy: 2 // <!-- HERE
}
},
scrollPerPage: true,
navigation: true
}).css("z-index", 0)
