twitter-bootstrap 猫头鹰旋转木马没有出现
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/30357466/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
提示：将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间：2020-10-21 22:41:58 来源:igfitidea点击:
Owl carousel not showing up
提问by user3689455
I am trying to get this owl thing going and its really pushing me back on a project.
我正在努力让这个猫头鹰的事情继续下去，它真的把我推回了一个项目。
<html>
<head>
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/owl.carousel.min.css">
<link rel="stylesheet" href="css/owl.theme.default.min.css">
</head>
<body>
<script src="js/jquery-1.11.3.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script>
$('.owl-carousel').owlCarousel({
loop:true,
margin:10,
nav:true,
responsive:{
0:{
items:1
},
600:{
items:3
},
1000:{
items:5
}
}
})
</script>
<div class="owl-carousel">
<div class="item"><img src = "img/bg1.jpg"></div>
<div class="item"><img src = "img/bg2.jpg"></div>
<div class="item"><img src = "img/bg3.jpg"></div>
<div class="item"><img src = "img/bg4.jpg"></div>
<div class="item"><img src = "img/bg5.jpg"></div>
<div class="item"><img src = "img/bg6.jpg"></div>
<div class="item"><img src = "img/bg7.jpg"></div>
<div class="item"><img src = "img/bg8.jpg"></div>
<div class="item"><img src = "img/bg9.jpg"></div>
<div class="item"><img src = "img/bg10.jpg"></div>
<div class="item"><img src = "img/bg11.jpg"></div>
<div class="item"><img src = "img/bg12.jpg"></div>
</div>
</body>
</html>
What am I doing wrong?
我究竟做错了什么？
回答by Jagadesh K
Here is the working code, you missed autoplay prop in the configuration
这是工作代码，您在配置中错过了自动播放道具
$(document).ready(function(){
$('.owl-carousel').owlCarousel({
loop:true,
margin:10,
nav:true,
autoPlay: 1000,
responsive:{
0:{
items:1
},
600:{
items:3
},
1000:{
items:5
}
}
})
});<link href="https://cdnjs.cloudflare.com/ajax/libs/owl-carousel/1.3.3/owl.carousel.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/owl-carousel/1.3.3/owl.carousel.min.js"></script>
<div class="owl-carousel">
<div class="item"><img src = "http://placehold.it/350x150"></div>
<div class="item"><img src = "http://placehold.it/350x150"></div>
<div class="item"><img src = "http://placehold.it/350x150"></div>
<div class="item"><img src = "http://placehold.it/350x150"></div>
<div class="item"><img src = "http://placehold.it/350x150"></div>
<div class="item"><img src = "http://placehold.it/350x150"></div>
<div class="item"><img src = "http://placehold.it/350x150"></div>
<div class="item"><img src = "http://placehold.it/350x150"></div>
<div class="item"><img src = "http://placehold.it/350x150"></div>
<div class="item"><img src = "http://placehold.it/350x150"></div>
<div class="item"><img src = "http://placehold.it/350x150"></div>
<div class="item"><img src = "http://placehold.it/350x150"></div>
</div>