owl-carousel - 在 Owl Carousel 2.3.4 中获取错误的点数
问题描述
当我删除自动宽度时,我的 Owl Carousel 的点数错误,但当我设置自动宽度时,它让我的点数错误。
错误的计数,比如我在轮播上总共设置了 8 张图像,它显示了 4 个的 8 个点实例(我设置了类似项目:2 和 slideBy:2)
现场演示:检查桌面分辨率。
HTML:
<div id=”client-testimonialslider” class="owl-carousel owl-theme">
<div class="item"><h4>1</h4></div>
<div class="item"><h4>2</h4></div>
<div class="item"><h4>3</h4></div>
<div class="item"><h4>4</h4></div>
<div class="item"><h4>5</h4></div>
<div class="item"><h4>6</h4></div>
<div class="item"><h4>7</h4></div>
<div class="item"><h4>8</h4></div>
</div>
$(document).ready(function(){
$('#client-testimonialslider').owlCarousel({
rtl:true,
loop:true,
nav:false,
margin:30,
items: 2,
slideBy: 2,
itemsDesktopSmall : [900,1], // betweem 900px and 601px
itemsTablet: [700,1], // 2 items between 600 and 480
itemsMobile : [479,1] , // 1 item between 479 and 0
autoplay:true,
autoplayTimeout:10000,
responsive:{
0:{
items:1,
slideBy: 1
},
600:{
items:1,
slideBy: 1
},
992:{
items:2,
slideBy: 1,
autoWidth:true
},
1201:{
items:3,
autoWidth:true
},
1400:{
items:1,
autoWidth:true
},
1600:{
items:3,
autoWidth:true
},
1800:{
items:3,
autoWidth:true
},
2000:{
items:4,
autoWidth:true
}
}
});
});
请帮我解决这个问题。
先感谢您。
解决方案
使用“dotsEach”选项指定每个项目的点数。
$('.owl-carousel').owlCarousel({
"dots": true,
"dotsEach": 1
});