jquery - 在flexslider中动态改变#container div的高度

Question

我正在使用 flexslider 并且容器 div 有一个背景图像，它的作用就像一个设置在它底部的边框。我需要做的是让容器 div 像实际的 flexslider div 一样响应。因此，当您从右向左缩小窗口时，容器 div 的高度应该改变高度，如果这有意义的话。图像尺寸为 1680x748。目前容器 div 的高度为 805px，宽度设置为 100%。所以宽度并不重要。只需要改变高度。

Answer 1

尝试这个 。

平滑高度：真，

function _flexslider(){
  $('.flexslider').flexslider({
    animation: "slide",
    animationLoop: false,
    pauseOnHover: true,
    smoothHeight: true,
    itemWidth: 280,
    itemMargin: 0,
    minItems: 1,
    maxItems: 1,
  });
}

Answer 2

选择.flexslider .slides img器已max-width设置为 100%，但添加height: 748px;到 CSS 中，它会将滑块带到该高度，这意味着您的所有图像都应该适合。

.flexslider .slides img {
     max-width: 100%; 
     height: 748px; 
     display: block;
}

Answer 3

所以我遇到了同样的问题，我注意到我正在将图像宽度切割到确切的 itemWidth 值。诀窍是让实际图像比该值大得多。因为如果插件无法将图像缩放得更大，那么就是实际大小。它可以减小其宽度以保持纵横比。