owl-carousel滑块没有响应

Question

我已经设置了owl-carousel滑块，它在jsbin http://jsbin.com/zivahewise/2/edit?html,css,output中工作得很好。

响应性和所有这些。然而，当我在Boostrap 3上实现它时，响应特性不起作用。有人知道为什么吗？

谢谢!

Answer 1

也许你会使用bootstrap类容器。您可以为ex删除。<div class='container'>并手动使用CSS。我想一切都会好起来的。;)

示例右侧代码HTML：

<div class="owl-carousel owl-theme">
   <div> Your Content </div>
   <div> Your Content </div>
   <div> Your Content </div>
   <div> Your Content </div>
   <div> Your Content </div>
   <div> Your Content </div>
  <div> Your Content </div>
</div>

Javascript：

  $('.owl-carousel').owlCarousel({
    loop:true,
    nav:true, 
    margin:10, 
    responsiveClass:true,            
    responsive:{
      0:{
         items:1 
      },
      480:{
         items:2, // from 480 to 677 
        nav:false 
      },

     678:{
        items:4, 
        center:true 
     },

     960:{
        items:5, 
        margin:20,
       center:false 
    },

    1200:{
       items:6,
       loop:false,
       margin: 30,
    }
  }
 })