我决定在Owl Carousel 2上制作一个滑块。一切正常,我喜欢它,但我注意到了一个错误。当我更改浏览器窗口(仅限Chrome)的大小时,滑块项目会重新排列,背面会有一个幻像项目。
HTML:
<div class="owl-carousel">
<img src="http://placehold.it/320x240?text=Slide%200">
<img src="http://placehold.it/320x240?text=Slide%201">
<img src="http://placehold.it/320x240?text=Slide%202">
<img src="http://placehold.it/320x240?text=Slide%203">
</div>
脚本:
$(".owl-carousel").owlCarousel({
loop: true,
margin: 20,
items: 3,
nav: true,
});
截图:
我该如何解决?
[Codepen]
答案 0 :(得分:10)
试试这个
.owl-carousel .owl-item img {
-webkit-backface-visibility: hidden;
}