javascript - 猫头鹰旋转木马 100% 高度

Question

我对 owl carousel 2 有一点问题，

这是我网站的旧版本， http: //lukaszradwan.com/pl/ 请看一下主滑块。这不是猫头鹰旋转木马，我不知道它是什么，但它工作正常（高度设置为 100%）——而且它太重了。

我已将其更改为猫头鹰旋转木马，请参阅此http://lukaszradwan.com/ 它反应灵敏，但我无法将高度设置为 100%。

JS

$('.owl-carousel').owlCarousel({
items:1,
margin:0,
loop:true,
nav:true
});

HTML

      <div class="slider_container">
      <div class="owl-carousel">
<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us">   </div>

<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us"></div>
<div class="item"><img src="img/banners/slajd.jpg" alt="The Last of us"></div>




      </div>
  </div>
</div>

如果您有任何想法如何做到这一点，请与我分享。提前致谢。

Answer 1

我用 CSS 解决了移动设备上的 100% 高度问题。我知道这不是最好的解决方案，但到目前为止它有效......

.header-carousel.owl-carousel.owl-theme.owl-loaded.owl-drag,
.header-carousel .owl-stage-outer,
.header-carousel .owl-stage,
.header-carousel .owl-item,
.header-carousel .item,
.header-carousel .owl-item,
.header-carousel .img-responsive{
    height: 100vh;
    object-fit: cover;
}