Question

我正在使用bxslider和根据屏幕尺寸缩放高度的图像。为了让它显示所有内容，它隐藏溢出我想要增加bx-viewport的高度我写的jquery只调整bx-wrapper的高度。这是下面的jquery和jsfiddle上的演示：http://jsfiddle.net/vgJ9X/838/

$( window ).resize(function() {
      width = $('.bx-wrapper').width()/3;
      width -= 14;
      var height = width+29;
      if (width > 160) {
          width = 160;
          height = 200;
      }
      box_height = height+height+(height/2);
      $('.bx-wrapper').css('height',box_height); 
      $('.bx-viewport').css('height',box_height); 

});

编辑：我的问题是为什么$（'。bx-viewport'）。css（'height'，600）;在调整大小功能中的位置时无法工作，但是当我在控制台中键入它时，我知道有一个自适应高度，但对于我的情况，我有6个图像：3高于3以下，所以下面的空间与它的尺寸相同必须计算图像的高度，对于该演示，我已经使用了预先存在的测试jsfiddle.net/vgJ9X/1，因为如果它适用于bxslider的一个实例，它应该与我的一起使用。我知道我是新手，我只是用jquery变得更好。与此帖Bxslider Setting Height不同，我需要在调整浏览器大小时更改高度，如果查看示例jsfiddle，您将看到底部导航选项卡为黑点移动，因为jquery确实更改了高度。我还需要为内容bx-viewport

的div实现相同的功能

Answer 1

这解决了这个问题。

.bx-viewport {
    height: 100% !important;
 }

它起作用，因为它是第一个div的孩子所以它继承了＃34;父母的高度。

Bx Slider增加div

1 个答案: