我正在使用旋转木马显示多个图像。图像最初显示得很好,但是当我向下滚动并返回时,每个图像都会放大,占据整个屏幕。我在代码中缺少哪些基本属性?
$(document).ready(function(){
$("#thecarousel").owlCarousel(
{items : 3,
loop : true,
margin : 1,
dots : true,
autoplay : true,
autoplayTimeout : 1300,
autoplayHoverPause : false,
responsive : {
0 : {
items : 1
},
400 : {
items : 2
},
768 : {
items : 3
}
}
}
);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/owl-carousel/1.3.3/owl.carousel.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/owl-carousel/1.3.3/owl.carousel.min.css" rel="stylesheet"/>
<div class="owl-carousel owl-theme" id="thecarousel">
<div class="item" style="width:280%">
<div class="col-xs-4" style="padding:30px">
<a>
<img src="{% static "images/Akorn" %}" alt="" />
</a>
</div>
</div>