Question

我正在使用Nivo Slider的jQuery插件，并且当只有一个图像存在时，需要找到一种方法来阻止它转换。

Answer 1

您可以设置选项：

manualAdvance: true

这会有帮助吗？ This是最新NivoSlider更新的文档。

如果这不会有帮助，您可以发布用于启用滑块的代码吗？

这将是完整的代码：

$(window).load(function() {
    $('#slider').nivoSlider({
        slices: 1, // For slice animations
        startSlide: 0, // Set starting Slide (0 index)
        manualAdvance: true, // Force manual transitions
        captionOpacity: 0.8, // Universal caption opacity
        randomStart: false, // Start on a random slide
        beforeChange: function(){}, // Triggers before a slide transition
        afterChange: function(){}, // Triggers after a slide transition
        slideshowEnd: function(){}, // Triggers after all slides have been shown
        lastSlide: function(){}, // Triggers when last slide is shown
        afterLoad: function(){} // Triggers when slider has loaded
    });
});

Answer 2

可能有更好的方法，但它对我有用：

if($('#slider img').length == 1) {
    $('#slider').nivoSlider({});
    $('.nivo-controlNav').css('display', 'none');
    $('.nivo-directionNav').css('display', 'none');
    $('#slider').data('nivo:vars').stop = true;
} else {
    $('#slider').nivoSlider({
        effect: 'slideInLeft'
    });
}

PS。在初始化Nivoslider之前检查图像的数量很重要，因为它似乎复制了图像标签......

Answer 3

这些答案对我来说都不起作用，因为我仍然希望单个图像显示带有标题。我最终使用稍微不同的选项来初始化nivoSlider，具体取决于图像的数量（我的图像位于包含id的'英雄图像'的div中）：

            var numImages = $('#hero-images img').length;

            if (numImages === 0) {
                //No images - hide the block
                $('#hero-images').hide();
            } else if (numImages === 1) {
                // 1 image - disable controls and set to manual advance to prevent animation
                $('#hero-images').nivoSlider({
                    directionNav: false,
                    manualAdvance: true,
                    controlNav: false
                });
            } else {
                // Multiple images, set up as normal
                $('#hero-images').nivoSlider({
                    effect: 'fade',
                    directionNav: false
                });
            }

Nivo Slider - 只有一个图像时停止动画

3 个答案: