Bxslider - 如何删除幻灯片？

Question

如何从bxslider中删除幻灯片？

HTML：

<ul class="bx_slider">
<li>1 - <a href="#" class="remove">Remove</a></li>
<li>2 - <a href="#" class="remove">Remove</a></li>
<li>3 - <a href="#" class="remove">Remove</a></li>
</ul>

Jquery的：

$(".bx_slider").bxSlider({
pager: false
});

https://jsfiddle.net/o2srcv28/

Answer 1

你可以做那样的事情

var slider = $(".bx_slider").bxSlider({
    pager: false
});

$('.remove').click(function() {
    $(this).parent().remove();
    slider.reloadSlider();
});

看看这个updated fiddle

希望它可以帮助你。

（解决方案在official doc）

编辑：

正如评论中所述，当最后一张幻灯片被删除时，跳转到第一张幻灯片是不可取的。

可能的解决方案是

$('.remove').click(function() {

    $(this).parent().remove();

    slider.reloadSlider({
        pager: false,
        startSlide: slider.getCurrentSlide()-1 // Starts the slider on the previous slide
    });
});

结果可以检查here或here (with more slides)