问题描述
我们正在使用一种特殊的系统,它使我们的用户可以设置幻灯片之间的延迟以及图像是否包含链接.我们正在使用mootools进行幻灯片演示,但希望更新为nivoSlider.
We are using a special system that allows our users to set a delay between slides and whether or not the image contains a link. We were using mootools for the slideshow but wish to update to nivoSlider.
根据我们的旧系统要求,php脚本会导出以下内容
A php script exports the following as per our old system requirements
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}
};
我只是在寻找一种方法来设置幻灯片显示中单个图像的延迟.
I am simply looking for a way to set the delays above to the individual images in the slideshow.
如果需要,我可以重新配置输出.我们整天都在尝试不同的方法,但没有成功.
If needed I can reconfigure the output. We have been trying different methods all day without success.
推荐答案
我正在使用带有'afterLoad'的数组,并且效果很好.
I'm using an array with 'afterLoad' and it works good.
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布局
hope this helps. The rest of your html is standar nivo layout
这篇关于jQuery Nivo Slider为每个幻灯片设置延迟时间的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!