Question

我第一次发布堆栈溢出，所以我希望有人能帮我解决这个问题：

我在页面上有3个nivo滑块，水平排列。我希望它们能够同步，但更常见的是它们不会在几秒钟后失去同步。当使用以下代码初始化所有滑块时就是这种情况：

    $(window).load(function() {
     $('#slider').nivoSlider({
      animSpeed:500,         
      pauseTime:3000,         
     });
    });

但是，我想我可以像这样设置一个滑块，另外两个带参数：

    manualAdvance:true,

然后使用：

    beforeChange: function(){},

在第一个滑块上控制另外两个 - 保持它们同步。但是......我不确定在这里使用什么功能才能转发其他滑块我已经看过了，我非常感谢你对此的帮助，提前谢谢！

Answer 1

这似乎并未在插件的核心中实现

但您可以自己添加

在Nivo Slider v2.6中，第633行的未压缩版本位于启动和停止功能声明的正下方

// Start / Stop
this.stop = function(){
    if(!$(element).data('nivo:vars').stop){
        $(element).data('nivo:vars').stop = true;
        trace('Stop Slider');
    }
}

this.start = function(){
    if($(element).data('nivo:vars').stop){
        $(element).data('nivo:vars').stop = false;
        trace('Start Slider');
    }
}

您可以添加以下功能

//Manually run the slider
this.run = function() {
        nivoRun(slider, kids, settings, 'next');
}

在改变了.js之后并且可能自己压缩它（http://javascriptcompressor.com/）你可以像使用它一样

$('#slider').nivoSlider().data('nivoslider').run();

把它放在正确的事件中你应该完成

Answer 2

设置暂停时间和animSpeed应该让你的nivo滑块同步我想到的。

你说“经常不会在几秒钟之后失去同步”，你是否有可能有暂停：真实并且你无意中将它们盘旋在它们之上并且它们正在失去同步。可能是一个愚蠢的问题，但这发生在我身上。

寻找一个同步多个nivo滑块的功能

2 个答案: