猫头鹰传送带100%高度 [英] Owl carousel 100% height

查看:87
本文介绍了猫头鹰传送带100%高度的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我对猫头鹰传送带2有点疑问,

I have a little problem with owl carousel 2,

这是我网站的旧版本, http://lukaszradwan.com/pl/ 请看一下主滑块.这不是猫头鹰传送带,我不知道它是什么,但是它可以正常工作(高度设置为100%)-而且太重了.

This is the old version of my site, http://lukaszradwan.com/pl/ please take a look at the main slider. This is not owl carousel, I don't know what it is but it works fine (height is set to 100%) - and it's too heavy.

我已将其更改为owl carousel,请参见 http://lukaszradwan.com/ 它反应灵敏,但我无法将高度设置为100%.

I have changed it to owl carousel, see this http://lukaszradwan.com/ It's responsive but I can't set height to 100%.

JS

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

HTML

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>

如果您有任何想法,请与我分享. 预先感谢.

If You have any ideas how to do this, please share with me. Thanks in advance.

推荐答案

我用CSS解决了手机上100%的高度问题. 我知道这不是最好的解决方案,但到目前为止,它仍然有效...

I solved the 100% height problem on mobile with css. I know this is not the best solution but it works so far ...

.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;
}

这篇关于猫头鹰传送带100%高度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆