OWL CAROUSEL固定高度？

问题描述：

我目前正在使用猫头鹰旋转木马，想知道是否有一种方法可以调整图像大小，以便每幅图像的高度一致。我使用这个插件来显示我的照片，并且我有横向和纵向尺寸。我尝试在JS中使用autoWidth，但它使我的肖像图像太大，我的风景图像太短，我如何让所有的图像有一个设定的高度？我试着调整CSS，但风景图像似乎在后面的图像后面，并没有显示全宽。它看起来像是一个设定的宽度，当我调整宽度时，图像会被拉伸。旋转木马中有19件物品。还尝试调整JS的响应部分中的项目，当我将它调整为两个项目时，风景图像是正确的比例，但肖像图像最终被拉伸。任何想法如何解决？OWL CAROUSEL固定高度？

这里的CSS代码，我用：

#demos img{ 
    display: inline-block; 
    max-width: auto; 
    height: 500px!important; 
    margin-bottom: 30px; 
    }

的Javascript：

$(document).ready(function() { 
    $('.owl-carousel').owlCarousel({ 
     loop: true, 
     margin: 0, 
     responsiveClass: true, 
     responsive: { 
     0: { 
      items: 1, 
      nav: true 
     }, 
     600: { 
      items: 3, 
      nav: false 
     }, 
     1000: { 
      items: 5, 
      nav: true, 
      loop: true, 
      margin: 0 
     } 
     } 
    }) 
    })

先给在PX的高度和宽度，然后给它一个像素最大高度。 jsfiddle或codepen的工作演示将会很棒。 –

它的作品，但是，响应性看起来不好，因为所有的图像现在是巨大的。有没有办法调整大小，以便在移动视图中高度不一致？ – rubyred2

您可以尝试使用背景大小：封面。 –

答

尝试像这样玩：如果你使用的引导

display:block; height:500px !important; margin:0 auto 30px;

答

，然后添加img-responsive类：

<img class="img-responsive">

这为我工作，我也面临着同样的问题。

OWL CAROUSEL固定高度？

相关推荐