jquery - 猫头鹰旋转木马未出现

标签 jquery html css twitter-bootstrap carousel

我正在努力让猫头鹰的事情继续下去,但它确实让我不得不推迟一个元素。

<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>

我做错了什么?

最佳答案

这是工作代码,您在配置中错过了 autoplay 属性

$(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>

关于jquery - 猫头鹰旋转木马未出现,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30357466/

相关文章:

javascript - 检查元素是否正在淡出 (Javascript/Jquery)

javascript - 单击它时如何更改一个按钮文本不是所有具有相同类的按钮

html - 是否可以使用 &lt;input type ="file"> 仅发布文件名而不实际上传文件?

javascript - 重定向到上一个 html 页面时,该页面不应刷新

javascript - 将 float 元素格式化为同一级别

html - 标题中的居中元素和右对齐元素都垂直对齐

javascript - 单击更改所有元素的数据状态

javascript - 无法在另一个日期选择器中更改日期选择器参数吗?

javascript - 如何在javascript中显示django表单对象?

javascript - 修改 JQuery 代码 CSS 选中