我在Supersized中设置了幻灯片的随机顺序,但只有背景图片是随机的,拇指保持相同的顺序。
这是图像随机滑动的代码(supersized.3.2.7.js)的一部分:
// Shuffle slide order if needed
if (base.options.random){
arr = base.options.slides;
for(var j, x, i = arr.length; i; j = parseInt(Math.random() * i), x = arr[--i], arr[i] = arr[j], arr[j] = x); // Fisher-Yates shuffle algorithm (jsfromhell.com/array/shuffle)
base.options.slides = arr;
}
这就是我调用幻灯片图片并设置拇指的方法:
jQuery(function($){
$.supersized({
random: 1,
thumb_links: 1,
slides: [
{ image: "slide_1.jpg", thumb: "thumb_1.jpg"},
{ image: "slide_2.jpg", thumb: "thumb_2.jpg"},
{ image: "slide_3.jpg", thumb: "thumb_3.jpg"},
{ image: "slide_4.jpg", thumb: "thumb_4.jpg"},
{ image: "slide_5.jpg", thumb: "thumb_5.jpg"},
{ image: "slide_6.jpg", thumb: "thumb_6.jpg"}
]
});
});
如何将拇指放在背景图像的相同随机顺序上?
我自己弄明白:我没有在Supersized中使用随机选项,而是定义了一个数组并对其进行排序。
var slidesArray = [
{ image: "slide_1.jpg", thumb: "thumb_1.jpg"},
{ image: "slide_2.jpg", thumb: "thumb_2.jpg"},
{ image: "slide_3.jpg", thumb: "thumb_3.jpg"},
{ image: "slide_4.jpg", thumb: "thumb_4.jpg"},
{ image: "slide_5.jpg", thumb: "thumb_5.jpg"},
{ image: "slide_6.jpg", thumb: "thumb_6.jpg"}
]
我打电话给插件:
$.supersized({
random: 0,
thumb_links: 1,
slides: slidesArray.sort(function() {return 0.5 - Math.random()})
});
效果很好,但我不确定这是否是最好的方法。有什么建议吗?
答案 0 :(得分:0)
考虑到文档提到random
仅影响幻灯片,似乎手动随机化列表,或者将其重新排序到其他任何其他需求确实是最佳方式。
答案 1 :(得分:0)
我找到了一种方式,有点......
var slidesArray = [
{ image: "slide_1.jpg", thumb: "thumb_1.jpg"},
{ image: "slide_2.jpg", thumb: "thumb_2.jpg"},
{ image: "slide_3.jpg", thumb: "thumb_3.jpg"}
]
和...
$.supersized({
random: 0,
thumb_links: 1,
slides: slidesArray.sort(function() {return 0.5 - Math.random()})
});
我是javascript的新手......关于如何让它变得更好的任何想法?