帶有隨機超時的jQuery幻燈片顯示

我想在我的網站的主頁上設置多個迷你幻燈片。如果你現在去那裏（http://www.element17.com/），你會看到有六個圖像分類，目前一些PHP從數據庫中抓取五個隨機圖像，並將它們全部放在「幻燈片」div中。這似乎是我見過的jQuery幻燈片插件中最流行的設置。我希望這六個中的每一個能夠通過五個隨機圖像進行幻燈片播放。帶有隨機超時的jQuery幻燈片顯示

但是，我希望每張幻燈片的超時時間都是隨機的，以便六個幻燈片不會相互同步。

我已經看到Cycle插件支持這個，但我一直沒有成功實現它。我不需要花哨的轉換（只是淡入淡出），我不需要任何其他功能，所以看起來這可能是最簡單的做法。雖然我沒有很多jQuery的經驗，所以我希望有人能夠讓我開始？

非常感謝！

來源

2011-04-04 NaOH

Cycle插件出了什麼問題？您應該可以像這樣使用它（未經測試）：

//time in ms 
var minTime = 2000; 
var maxTime = 5000; 
$(document).ready(function() { 
    $('.slideshow').each(function(ind) { 
     $(this).cycle({ 
      timeout:Math.floor((Math.random()*(maxTime-minTime))+minTime), 
      speed:1000 
     }); 
    }); 
});

只需根據需要更改最小和最大時間。

來源

2011-04-04 08:55:12 shanethehat

這幾乎完美！我怎樣才能將你的超時與那個Cycle插件的其他參數結合起來？這似乎是當我添加另一個參數（如速度）它打破幻燈片。 – NaOH 2011-04-04 09:25:37

我編輯了我的答案，包括設置速度。如果您想要添加更多參數，請確保除最後一個之外的所有參數都後接逗號。 – shanethehat 2011-04-04 09:48:08

啊，看看你的頁面源代碼，出了什麼問題是你的超時線有點不對。它缺少'Math.floor'，並且底層函數的右括號放置在下一行。 – shanethehat 2011-04-04 09:57:10

帶有隨機超時的jQuery幻燈片顯示

回答

相關問題