Owl 轮播 2 不可见但没有错误

Question

我一直在尝试让 Owl Carousel 2 在我的开发站点上运行。我之前已经无数次使用过它，所以很明显我在做一些愚蠢的事情。我可以 v1.x 工作。

http://www.creativethings.nz/web/the-house

我没有发现任何错误，我很确定它基本上可以正常工作，只是没有显示出来。可能是 CSS 问题，但我使用的是 Owl Carousel 2 中的股票 CSS。

在头部：

<link rel="stylesheet" href="owl2/owl.carousel.css" />
<link rel="stylesheet" href="owl2/owl.theme.default.min.css">

中体：

<div id="gallery" class="owl-carousel owl-theme">
<div><img src="web/images/gallery/sd.jpg"/></div>                                                                                                                                
<div><img src="web/images/gallery/sd.jpg"/></div>                                                                                
</div>

正文结尾：

<script type="text/javascript" src="owl2/owl.carousel.min.js"></script>  
<script> 
$(window).on('load',function() { 
$(".owl-carousel").owlCarousel();
});
</script>

我观察到，通过检查 Chrome 并将 .owl-stage-outer 的 CSS 更改为 overflow:visible，它在彼此并排放映幻灯片。谁能帮忙诊断解决一下？

Answer 1

您需要在初始化轮播时设置"items"选项。

    $(window).on('load',function() { 
      $('.owl-carousel').owlCarousel({items:1});
    });

工作 JSFiddle Here

Owl 轮播 2 不可见但没有错误

Owl Carousel 2 not visible but no errors

css

jquery

owl-carousel-2