禁用第一张幻灯片上的“上一页”按钮？ Nivoslider

Question

我正在将Nivoslider用于正在处理的Web项目。

从上面的链接可以看到，即使在第一张幻灯片上，也会显示“上一页”按钮。

我可以将NivoSlider设置为“线性”并且仅在幻灯片编号大于0时才显示上一个按钮吗？

NivoSlider似乎默认情况下设置为“无限”或“圆形”，但是我敢肯定必须有一种方法来改变它。

非常感谢您对此的任何帮助:-)

Answer 1

初始化滑块时，可以使用自定义的afterChange函数。

var sliderSelector = '#slider'; // Replace with your slider selector
$(sliderSelector).nivoSlider({
    // .. Other config here
    controlNav: true, // This solution relies on this to work
    afterChange: function() {
        // Hide prev button if on first slide
        if ($(sliderSelector + ' .nivo-controlNav .nivo-control:first').hasClass('active'))
            $(sliderSelector + ' .nivo-prevNav').hide();
        else
            $(sliderSelector + ' .nivo-prevNav').show();

        // Hide next button if on last slide
        if ($(sliderSelector + ' .nivo-controlNav .nivo-control:last').hasClass('active'))
            $(sliderSelector + ' .nivo-nextNav').hide();
        else
            $(sliderSelector + ' .nivo-nextNav').show();
    },
    afterLoad: function() {
        // If you have randomStart set to true, then you might check with what slide it started and act accordingly.
        // If you use the default, then this should be all you need
        $(sliderSelector + ' .nivo-prevNav').hide();
    }
});