Question

我们可以根据幻灯片内容设置bx滑块的高度吗？

好像现在我在幻灯片中逐个拥有3张图片而另一张幻灯片只有一张图片，因此它在一张图片幻灯片中获得了大量的空白空间。在这里，我正在粘贴我的代码：

<div class="slider">                
              <ul class="bxslider-two">
                <li>
                <div class="caption1 top_caption">
                <h4 class="section-title">Group Show </h4>
                <p class="font_11">London: 24 Grafton Street / September 5 - October 3, 2015 </p>
                </div>

                <a class="group1" href="images/WDP_6372.jpg" title=""><img src="images/WDP_6372.jpg" alt=""></a>
                <a class="group1" href="images/WDP_6375.jpg" title=""><img src="images/WDP_6375.jpg" alt=""></a>
                <a class="group1" href="images/WDP_6376.jpg" title=""><img src="images/WDP_6376.jpg" alt=""></a>
                <div class="caption1"> 
                    <span>Chittrovanu Mazumdar, The Other Face, 2015. Acrylic on canvas, 100 x 100 cm, Edition 1 of 4 <span class="pull-right download_catelog"><a href="#"><i class="fa fa fa-download"></i>Download CV</a></span></span>
                    <a href="">Request Information >></a>
                  </div>
                </li>
                <li>
                <div class="caption1 top_caption">
                <h4 class="section-title">Group Show </h4>
                <p class="font_11">London: 24 Grafton Street / September 5 - October 3, 2015 </p>
                </div>
                <a class="group1" href="images/DSC_0044.jpg" title=""><img src="images/DSC_0044.jpg" alt=""></a>

                <div class="caption1"> 
                    <span>Chittrovanu Mazumdar, The Other Face, 2015. Acrylic on canvas, 100 x 100 cm, Edition 1 of 4 <span class="pull-right download_catelog"><a href="#"><i class="fa fa fa-download"></i>Download CV</a></span></span>
                    <a href="">Request Information >></a>
                  </div>
                </li>


              </ul>
            </div>

有人可以帮我这个吗？

Answer 1

如果我错了，请纠正我，但看起来你正试图实现更多的自动收报机方法（连续图像滚动都有自己的链接）。

也许尝试BXSlider's 'Ticker Mode'以避免间距问题。您可以设置速度，但自定义不详细。

如果这不是您正在寻找的内容，请尝试使用多项内容滑块such as this

否则，您需要更具体地了解您希望实现的目标。

Answer 2

您可以使用adaptiveHeight选项执行此操作。

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

一些bxslider示例（http://bxslider.com/examples）。有幻灯片使用的设置 adaptiveHeight（http://bxslider.com/examples/slideshow-adaptive-height）

我们可以根据幻灯片内容设置bx warppper的高度

2 个答案: