猫头鹰旋转木马不工作（也许是冲突？）

Question

我正在尝试在我的页面添加一个全宽猫头鹰轮播滑块，但我无法让它工作。

我认为这可能与我正在使用的模板发生冲突。

这是我添加所有内容的方式：

（当然包括所有猫头鹰轮播文件后）

首先，我包含了所有文件：

<!-- Important Owl stylesheet -->
<link rel="stylesheet" href="owl-carousel/owl.carousel.css">

<!-- Default Theme -->
<link rel="stylesheet" href="owl-carousel/owl.theme.css">

<!--  jQuery 1.7+  -->
<script src="assets/js/jquery-1.9.1.min.js"></script>

<!-- Include js plugin -->
<script src="assets/owl-carousel/owl.carousel.js"></script>

然后我在标题中添加了名为owl carousel的内容：

<script>
    $(document).ready(function() {
        $("#owl-example").owlCarousel();
    });
</script>

最后我添加了html代码：

<!-- slider -->
<div id="owl-example" class="owl-carousel">
    <div class="owl-slide"><img src="http://cumbrianrun.co.uk/wp-content/uploads/2014/02/default-placeholder.png"> Slide 1 </div>
    <div class="owl-slide"><img src="http://cumbrianrun.co.uk/wp-content/uploads/2014/02/default-placeholder.png"> Slide 2 </div>
    <div class="owl-slide"><img src="http://cumbrianrun.co.uk/wp-content/uploads/2014/02/default-placeholder.png"> Slide 3 </div>
</div>
<!-- end slider -->

但这是我得到的结果：

这是我想要添加滑块的地方：URL（缩短的网址，因为我不希望这会影响搜索引擎优化）

Answer 1

加载owl.carousel.js文件时出错，请确保输入正确的路径。你有很好的项目，但没有运行轮播，因为还没有应用javascript！

的修改

现在在输入正确的链接之后，您必须添加更多幻灯片才能让轮播工作，因为现在所有幻灯片都在显示，或者您可以像使用以下js一样使用一张幻灯片：

$(document).ready(function() {

$("#owl-demo").owlCarousel({

  navigation : true, // Show next and prev buttons
  slideSpeed : 300,
  paginationSpeed : 400,
  singleItem:true

   // "singleItem:true" is a shortcut for:
   // items : 1, 
   // itemsDesktop : false,
   // itemsDesktopSmall : false,
   // itemsTablet: false,
   // itemsMobile : false

   });

});