html - owlcarousel 宽度有问题

Question

http://makarskarivijera.hr/

这就是 .html 所说的

<div class="row">
  <div class="col-lg-7 col-sm-6">
    <div class="owl-carousel" id="homeCarousel">
      <div class="item">
      <img src="images/brela.jpg" alt="brela makarska">
      </div>
    </div> 
  </div> 
</div>

这是我检查时得到的结果

<div class="row">
<div class="col-lg-7 col-sm-6">
<div class="owl-carousel owl-theme" id="homeCarousel" style="opacity: 1; display: block;">
<div class="owl-wrapper-outer">
<div class="owl-wrapper" style="width: 3918px; left: 0px; display: block; -webkit-   transform: translate3d(0px, 0px, 0px); -webkit-transform-origin: 326.5px 50%;">
<div class="owl-item" style="width: 653px;">
<div class="item">
<img src="images/brela.jpg" alt="brela makarska"/>

我想更改宽度:653px，但我不知道在哪里可以找到它

如果有人可以分享信息那就太好了:) 谢谢

Answer 1

在您的 javascript 文件中查找“.owlCarousel(” 它应该是一个运行和控制猫头鹰旋转木马的函数。它与 owl.carousel.min.js 无关，而是一个函数调用该代码。我有这样的东西:

 .owlCarousel({
    items: 10,
    rewindNav: false
});

更改 items:10 它应该会更改每张图片的宽度。然后你可以添加到你的函数中，比如 -

$("#owl-example").owlCarousel({ 
        items:10,   
        itemsDesktop : [1199,10],
        itemsDesktopSmall : [980,9],
        itemsTablet: [768,5],
        itemsTabletSmall: false,
        itemsMobile : [479,4]
})

寻找“自定义”- https://owlcarousel2.github.io/OwlCarousel2/docs/api-options.html