今天早上花了20分鐘研究了一下如何使用javascript code來自動改寫CSS的內容,如此一來就可以隨機更新我的blog banner了 ^^ 大家可以多試幾次「重新整理 F5」,就清楚了! 以後會慢慢新增一些blog banner在,不然一直使用別人(樣本)的blog banner也不好,怎麼說自己也是有不少還可以的照片,不用好像太對不起自己了 :P  對這個功能也有興趣的朋友,可以連結到延伸閱讀的那幾篇文章看看就明白了 :)

後記:
我也把程式碼作了一點小更動,原因是要維持每張照片出現的機率均等。例如我現在想製造一個0-3之間的隨機整數,依照Kaie的寫法,出現0的可能是當3*Math.random()計算結果為0-0.4999,而出現1的可能是當3*Math.random()計算結果為0.5-1.499之間,明顯的看來第一張照片(banner[0])的出現機率硬是比第二張(banner[1])的機率小了約一半,同裡最後一張照片的出現機率也會較低一點。所以我把我的計算方式從四捨五入(round)的語法改成無條件捨去(floor),這樣一來各張出現的機率將更為均等。 :)  。所以其中那句程式碼將改程如下所示,其中
4就是表示總共有4張圖片(也就是產生0-3之間的隨機整數)囉!! ^^

var random=Math.floor(4*Math.random());

2007.09.20後記:
另外,也可以把
4改成banner.length這個變數(就是變成下面的程式),這樣一來它就會自動依照banner這個array的長度(個數)作調整,所以以後新增圖片的話,就不用去更動那個數字囉 ^^

var random=Math.floor(banner.length*Math.random());

延伸閱讀:
站內:
*
[站務] Blog banners 整理!!!
站外:
* [ blog ] 怎樣讓 banner 可以有換圖的效果  走過的、學過的、看過的
* Kaie's Blog: [Blog] Random Rotating Banner Hack
* Freeyasoul Adventure: Random Rotating Banner Hack
* JavaScript - Wikipedia
* CSS - Wikipedia

sandor 發表在 痞客邦 留言(27) 人氣()