我使用jQuery光滑插件(http://kenwheeler.github.io/slick/)创建了一个轮播。我想使用“幻灯片”设置来指定轮播中使用的元素。此设置的说明如下:
类型:元素
默认值:''
用作幻灯片的元素查询
我对此设置的理解是,如果我指定'div',则只有div元素将显示在轮播中。我不能让这个工作。当我创建轮播时,会显示容器中的所有元素。
我创建了一个简单的例子:
<div class="slickContainer">
<div class="slickItem">
Item 1
</div>
<div class="slickItem">
Item 2
</div>
<p>
Shouldn't be an item.
</p>
</div>
$(".slickContainer").slick({
slide: 'div'
});
我也试过“slide:$('。slickItem')”,但这也不起作用。
https://jsfiddle.net/Lobfdodo/
在“结果”面板中,如果单击左/右箭头,您将在轮播中看到所有三个元素(div和p)。我只想将div元素拉入旋转木马。
有什么建议吗?
答案 0 :(得分:2)
我有类似的问题,可以使用以下方法解决:
$(".slickContainer").slick({
slide: 'div',
rows: 0
});
答案 1 :(得分:1)
我有类似的问题。诀窍是,实例化滑块,然后过滤掉你想要显示的内容。
工作小提琴:https://jsfiddle.net/m8uxqrt3/
$(".slickContainer").slick().slick('slickFilter', '.slickItem');