Javascript Nivo Slider 不同的滑动时间

Posted 2023-05-07

【中文标题】Javascript Nivo Slider 不同的滑动时间

【英文标题】：Javascript Nivo Slider different slide times

【发布时间】：2015-07-15 01:00:34

【问题描述】：

我正在使用 nivoSlider 插件在客户网站上幻灯片放映横幅。我需要为每张幻灯片设置不同的延迟时间。我找到了这个解决方案：

var nivoSliderDelays = [5000,2000,3500];

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


$('#slider').nivoSlider(
 pauseTime: 3000,
 startSlide: 0,
 directionNav: true,
 controlNav: true,
 controlNavThumbs: false,
 pauseOnHover: false,
 manualAdvance: true,
 beforeChange: function(),
 slideshowEnd: function(),
 lastSlide: function(),
 afterLoad: function() setDelay() ,
 afterChange: function() setDelay() 
);

正如您在client's website 上看到的那样，这似乎工作正常。问题是，如果您通过controlNav 或directionNav 导航，脚本就会发疯。所有设置的延迟似乎都变成了无法解释的短时间，每张幻灯片都有不同的时间。

因为客户端可以通过 CMS 更改每张幻灯片的时间，我不得不将 nivoSliderDealys 设置为全局 javascript 变量，你认为这可能是问题吗？我还有其他机会从 scripts.js 访问存储在 mysql 数据库中的变量吗？

【参考方案1】：

可能是您的问题是通过 controlNav 属性引起的，我刚刚更新了 nivoSlider 函数中的部分代码，您可以添加并尝试。

$('#slider').nivoSlider(       
        animSpeed: 300,                 // Slide transition speed
        pauseTime: 3000,               // How long each slide will show
        pauseOnHover: false,             // Stop animation while hovering
        manualAdvance: true,           // Force manual transitions
        prevText: '<',                // Prev directionNav text
        nextText: '>',                // Next directionNav text
        randomStart: false,             // Start on a random slide
        beforeChange: function(),     // Triggers before a slide transition
        slideshowEnd: function(),     // Triggers after all slides have been shown
        lastSlide: function(),        // Triggers when last slide is shown
        afterLoad: function() setDelay() ,
        afterChange: function() setDelay() 
    );

问题是由以下属性引起的:)

    slices: 15,                     // For slice animations
    boxCols: 8,                     // For box animations
    boxRows: 4,     

【讨论】：

在哪里可以下载最新版本的 nivoSlider 以及您所做的更新？我从 github 下载了最新版本，并从列表中删除了 controlNav 属性、切片、boxCols 和 boxRows 属性，但结果没有任何变化，正如您在网站上看到的那样。

需要自动滑动还是手动滑动，能否解释清楚。

一般我希望用户会自动滑动它。当我手动滑动它时它仍然会这样做，所以延迟是可以的，直到我切换幻灯片。然后延迟看起来像是随机生成的。一段时间后，它会自动恢复设置延迟并按预期再次工作。