我没有使用 jquery 做任何事情，也没有使用 JavaScript 做很少的事情，并且正在尝试向我的页面添加一个带有一些图像的 Owl Carousel。我已经从他们的网站粘贴了代码，理论上应该可以工作，变量名称似乎相加，但它根本不显示在我的页面上。抱歉，这对我来说是全新的，我似乎在其他地方找不到任何答案。
HTML
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link href="EvositeCSS.css" rel="stylesheet" type="text/css">
<link href='http://fonts.googleapis.com/css?family=Bree+Serif' rel='stylesheet' type='text/css'>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<!-- Important Owl stylesheet -->
<link rel="stylesheet" href="OwlCarousel/owl-carousel/owl.carousel.css">
<!-- Default Theme -->
<link rel="stylesheet" href="OwlCarousel/owl-carousel/owl.theme.css">
<script src="EvositeJS.js"> </script>
</head>
<div id="owl-demo" class="owl-carousel">
<div class="item"> <img src="Images/EvositeLogo.PNG"> </div>
<div class="item"> <img src="Images/DiabetesUKLogo.PNG"> </div>
</div>
CSS
#owl-demo .item{
margin: 3px;
}
#owl-demo .item img{
display: block;
width: 100%;
height: auto;
}
JavaScript
$(document).ready(function() {
$("#owl-demo").owlCarousel({
autoPlay: 3000, //Set AutoPlay to 3 seconds
items : 4,
itemsDesktop : [1199,3],
itemsDesktopSmall : [979,3]
});
});
最佳答案
您忘记引用 owl.carousel.js 文件，如下所示:
<script src="assets/owl-carousel/owl.carousel.js"></script>
关于javascript - Owl Carousel 不显示，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31443215/