[英]Supersized random thumb order
我在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中的random選項,而是定義了一個數組並對它進行排序。
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()})
});
效果很好,但是我不確定這是否是最好的方法。 有什么建議么?
考慮到文檔中提到random
只影響幻燈片,似乎手動將列表隨機化,或者以其他方式將其重新排序為幾乎您需要的其他任何方式,確實是最好的方法。
我找到了一種方法,...
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的新手……關於如何使其變得更好的任何想法?
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.