Question

我在将bxslider中的最后一张幻灯片设置为第一张幻灯片时出现问题。

以下代码将所有其他幻灯片设置为列表中的第一个，但最后一张幻灯片始终显示为列表中的最后一张幻灯片。

这是javascript：

$(document).ready(function(){

  var count = $('.bxslider li.active').index();


  $('.bxslider').bxSlider({
    minSlides: 8,
    maxSlides: 8,
    slideWidth: 121,
    slideMargin: 12,
    pager: false,
    startSlide: count,
    moveSlides: 1,
    infiniteLoop: true
  });

});

我不确定这是否与使用infiniteLoop或其他东西有关，但是如果有人能够对此有所启发那就太棒了！

谢谢

Answer 1

我在尝试调整一些用户体验时也遇到了同样的问题。

我发现如果在加载滑块之前隐藏了幻灯片，那么“开始滑动”就会被隐藏起来。选项将不会被遵守。

我通过CSS将所有幻灯片隐藏在默认幻灯片之外，因为幻灯片最初会在加载时显示，然后在bxSlider初始化后消失。为了防止这种情况，我创建了一个名为＆＃39; hideuntilloaded＆＃39;的css类。其中有一个display:none;条目并应用于幻灯片以防止它们在加载过程中显示。一旦滑块成功加载，我就从幻灯片中删除了该类。

这引起了“startSlide”的上述问题。选项没有被遵守（以及其他一些包括重复的条目开始出现！）。

要解决此问题，请确保在初始化滑块之前再次显示幻灯片，方法是删除“hiduntilloaded”＆＃39;在启动滑块之前在线上的类。例如：$('.hideuntilloaded').removeClass('hideuntilloaded');

似乎仍然可以防止幻灯片在加载过程中闪烁。

如果您正在做与幻灯片的可见性类似的任何事情，那么这可能是原因。

bxslider最后一张幻灯片不会被设置为startSlide

1 个答案: