Jquery Nivo Slider为每张幻灯片设置延迟时间答案

【问题标题】：Jquery Nivo Slider set delay time for each slideJquery Nivo Slider为每张幻灯片设置延迟时间
【发布时间】：2012-11-09 20:57:13
【问题描述】：

我们正在使用一个特殊的系统，它允许我们的用户设置幻灯片之间的延迟以及图像是否包含链接。我们在幻灯片中使用 mootools，但希望更新到 nivoSlider。

一个 php 脚本根据我们的旧系统要求导出以下内容

var data = {
'0225201274127_1.jpg': {delay:4000},
'0225201274417_4.jpg': {delay:3000},
'0225201274624_9.jpg': {delay:5000},
'0225201274607_8.jpg': {delay:3000},
'0225201274456_6.jpg': {delay:6000},
'0225201274521_7.jpg': {delay:7000},
'0225201274435_5.jpg': {delay:3000},
'0225201274338_2.jpg': {delay:2000},
'0225201274647_10.jpg': {delay:1000},
'0225201274359_3.jpg': {delay:6000},
'0225201274707_11.jpg': {delay:4000}
};

我只是在寻找一种方法来将上述延迟设置为幻灯片中的单个图像。

如果需要，我可以重新配置输出。我们整天都在尝试不同的方法，但没有成功。

【问题讨论】：

标签： jquery nivo-slider

【解决方案1】：

我正在使用带有“afterLoad”的数组，效果很好。

  var delays = [4000,3000,5000,3000]; //your delay array

    function pageLoad() {
        $(function () {
            $('#slider').nivoSlider({
                pauseTime: 50000,
                directionNav: true,
                afterChange: function () { setDelay() },
                afterLoad: function () { setDelay() },
                controlNav: true,
                pauseOnHover: false
            });
        });
    }

    function setDelay() {
        var currentSlide = $('#slider').data("nivo:vars").currentSlide;
        setTimeout(function () {
            $('#slider').find('a.nivo-nextNav').click()
        }, delays[currentSlide]);

    }

希望这会有所帮助。你的 html 的其余部分是标准的 nivo 布局

【讨论】：