gpt4 book ai didi

owl-carousel - 具有自定义类的启动项目 owlcarousel2 slider

转载 作者:行者123 更新时间:2023-12-03 09:09:18 26 4
gpt4 key购买 nike

我使用 owlcarousel2 slider ,并且我希望幻灯片项目显示该自定义类

jQuery(document).ready(function($){
$(".owl-carousel").owlCarousel({
items: '7',
rtl: true,
});
});
<div class="item">
<img src="http://welearn.site/wp-content/uploads/2016/09/k2.jpg" title="" alt="" />
</div>
<div class="item">
<img src="http://welearn.site/wp-content/uploads/2016/09/k2.jpg" title="" alt="" />
</div>
<div class="item">
<img src="http://welearn.site/wp-content/uploads/2016/09/k2.jpg" title="" alt="" />
</div> <div class="item">
<img src="http://welearn.site/wp-content/uploads/2016/09/k2.jpg" title="" alt="" />
</div>
<div class="item">
<img src="http://welearn.site/wp-content/uploads/2016/09/k2.jpg" title="" alt="" />
</div>
<div class="item">
<img src="http://welearn.site/wp-content/uploads/2016/09/k2.jpg" title="" alt="" />
</div>
<div class="item custom-slide">
<img src="http://welearn.site/wp-content/uploads/2016/09/k2.jpg" title="" alt="" />
</div>

我希望 slider 以自定义类“custom-slide”开头

最佳答案

您尚未指定要覆盖哪个类。 (几乎)描述了所有 Owl Carousel 2 类 here .

默认情况下,Owl Carousel 2 生成以下代码:

<div class="owl-carousel owl-theme owl-loaded">
<div class="owl-stage-outer">
<div class="owl-stage">
<div class="owl-item">...</div>
<div class="owl-item">...</div>
<div class="owl-item">...</div>
</div>
</div>
<div class="owl-controls">
<div class="owl-nav">
<div class="owl-prev">prev</div>
<div class="owl-next">next</div>
</div>
<div class="owl-dots">
<div class="owl-dot active"><span></span></div>
<div class="owl-dot"><span></span></div>
<div class="owl-dot"><span></span></div>
</div>
</div>
</div>

如果您确实需要,您可以在初始化轮播时更改这些类(尽管我在文档中找不到更好的方法):

$('.owl-carousel').owlCarousel({
items: '7',
rtl: true,
refreshClass: 'owl-refresh',
loadedClass: 'owl-loaded',
loadingClass: 'owl-loading',
rtlClass: 'owl-rtl',
responsiveClass: 'owl-responsive',
dragClass: 'owl-drag',
itemClass: 'owl-item',
stageClass: 'owl-stage',
stageOuterClass: 'owl-stage-outer',
grabClass: 'owl-grab',
autoHeightClass: 'owl-height',
navContainerClass: 'owl-nav',
navClass: [ 'owl-prev', 'owl-next' ],
slideBy: 1,
dotClass: 'owl-dot',
dotsClass: 'owl-dots'
})

关于owl-carousel - 具有自定义类的启动项目 owlcarousel2 slider ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44213120/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com