1

Owl カルーセルを Web ページに追加したいのですが、読み込まれず、ブラウザー コンソールにエラー メッセージが表示されません。カルーセルがロードされないのはなぜですか??

<!DOCTYPE html> 

 <html>
<head>
<link rel= "stylesheet" type="text/css" href="CSS_Header.css"/>

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

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

<!--  jQuery 1.7+  -->
<script src="https://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="https://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>


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

<div id="Items" class="owl-carousel">
  <div><img src="slide1.png"/></div>
  <div><img src="slide1.png"/></div>
  <div><img src="slide1.png"/></div>

<script type="text/css">
  $(document).ready(function() { 
    $("#Items").owlCarousel();

});
</script>

</div>

</body>
</html>
4

3 に答える 3

1

I believe you should add the class .item for each item you add on your owl carousel, so the structure is right for the owl-corousel recognize.

<div id="Items" class="owl-carousel">
  <div class="item"><img src="slide1.png"/></div>
  <div class="item"><img src="slide1.png"/></div>
  <div class="item"><img src="slide1.png"/></div>

<script type="text/css">
  $(document).ready(function() { 
    $("#Items").owlCarousel();

});
</script>

</div>
于 2017-03-03T01:16:59.267 に答える
0

jquery-1.9.1.min.js のような jQuery の以前のバージョンで試してください

于 2015-05-03T10:43:51.530 に答える