Question

我有两张bxslider幻灯片，其中一张有多个＆＃34;标签＆＃34;加载或隐藏内容。如果不刷新整个页面，有没有办法快速更改幻灯片窗口的高度？

这是我正在使用的滑块：http://www.otse.org/slider-test/

基本上，我想要为用于子类别按钮的标签添加动作。

Answer 1

创建bxslider时，您需要传递adaptiveHeight: true

$('.bxslider').bxSlider({
  adaptiveHeight: true
});

请参阅bxSlider文档示例here。

Answer 2

我遇到了类似的问题，当用户点击bxslider内容的某些html文本时，textarea会替换内容并且滑块的高度需要更改。我最终这样做了，

   $('.best_in_place').click(function(){
        var height = $(this).closest('li').css('height'); 
        $('.bx-viewport').css("height",height);

    });

我认为您可以用标签的任何类或ID替换.best_in_place，并根据您的隐藏/显示内容更改.bx-viewport的高度。

我的HTML：

<ul id="reviews" class="bxslider">
   <li class='review-item'></li>
   <li class='review-item'></li>
   <li class='review-item'></li> 
</ul>

（列表项内容使用Ajax动态加载）

使用动态内容刷新bxslider幻灯片的高度

2 个答案: