使用Ajax添加新图像时动态更新BxSlider

Question

我使用BxSlider jQuery在滑块中显示多个图像。我将图像加载到无序列表中，它们显示在滑块中。到目前为止一切都很好。

好的，这是我试图解决的问题。我有很多照片，我只想加载前40首。当滑块到达最后一个时，我计划通过Ajax请求添加新的滑块。

重新加载滑块以拍摄新图像的选项是使用以下方法。

• reloadSlider()
• destroySlider()

但它做了什么它重新加载滑块并重新开始第一张图像，而我想要的是继续幻灯片添加图像。

有关此问题的任何建议/帮助？ 感谢。

Answer 1

对你来说可能为时已晚，但对其他人来说则不然，bxSlider API允许你用

获取当前幻灯片

yourSlider.getCurrentSlide()

这样，您可以将当前幻灯片索引存储在某处，并在使用

重新加载滑块时再次使用它

yourSlider.reloadSlider()

使用选项startSlide

这将是这样的：

var mySlider = $('.bxslider').bxSlider();

/* The part where you add your images */

var currentSlide = mySlider.getCurrentSlide();

mySlider.reloadSlider({
    startSlide: currentSlide,
    //whatever your options were
});