猫头鹰旋转木马纵横同高

Posted 2023-03-07

【中文标题】猫头鹰旋转木马纵横同高

【英文标题】：owl carousel vertical and horizontal with the same height

【发布时间】：2016-07-29 00:07:21

【问题描述】：

我正在尝试使用带有垂直和水平图像的猫头鹰轮播制作轮播，我希望两种图像的高度和宽度自动相同。 我不明白我是否只能使用css来实现这一点，或者我需要使用js来更新每个图像的高度

这是我的密码笔http://codepen.io/mp1985/pen/LNejmO

$('.owl-carousel').owlCarousel(
    loop:true,
    nav:true,
    responsive:
        0:
            items:1
        ,
        800:
            items:3
        ,
        1000:
            items:3
        
    
);

有什么帮助或建议吗？

【问题讨论】：

这里有答案：***.com/questions/21574698/…

【参考方案1】：

如果您使用 CSS 在图像上设置最大高度

.owl-carousel .item img
  max-height:600px;

并更新 JS 函数以包含

autoWidth:true,

这应该可行

在此处查看演示 http://www.owlcarousel.owlgraphic.com/demos/autowidth.html