猫头鹰旋转木马幻灯片所有呈现为一个堆积块

Question

以下是我的代码为一个非常基本的猫头鹰旋转木马。这意味着在任何时候只有一个图像/幻灯片显示，但是在一分钟之内，我将在一张幻灯片中堆叠所有这些图像。我相信我一定会做出明显错误的事情。

<ul class="showcasecarousel"> 

    <li class="item"><img src="img/trackback.png" alt="Some text here"></li> 
    <li class="item"><img src="img/trackback.png" alt="Some text here"></li> 
    <li class="item"><img src="img/trackback.png" alt="Some text here"></li> 

</ul> 

中的JavaScript在我的HTML文件的底部是：

$('.showcasecarousel').owlCarousel({ 
    navigation : false, // Show next and prev buttons 
    slideSpeed : 300, 
    paginationSpeed : 400, 
    singleItem: true, 
    loop: true, 
}); 

最后，CSS我是：

.showcasecarousel .item img{ 
    display: inline; 
    width: 100%; 
    height: auto; 
} 

的CSS的两个和猫头鹰JS文件旋转木马和JavaScript也已被正确包含 - 同一页面上还有其他的旋转木马，并且它们工作正常。任何帮助将不胜感激。

Answer 1

我想你忘了items属性。在你的javascript插入items: 1,。此外，为什么twitter-bootstrap被标记？再看看猫头鹰传送带文档：https://owlcarousel2.github.io/OwlCarousel2/demos/demos.html