有在用MSN的朋友一定都知道有動畫快遞這種功能,有些動畫快遞也蠻KUSO的。其實這些動畫說穿了大多只是swf檔,不過靠著swf中的動畫就能讓人有新奇的感覺,既然是swf檔的話,那網頁中當然也能播放囉。
先來看範例好了:
http://abgne.myweb.hinet....008_1.html嘿嘿~是不是很神奇啊!做法很簡單,讓我們先來看Body內的Code:
我先放了六張圖,並在每張圖內加了個onClick的Event,當圖片被Click時就會觸發show()函式,並把圖片的src當參數使用。還有一個DIV是用來放我們要播放的動畫使用的。
接著就是本篇的重點了:
先說一下我網頁中那六張圖片跟swf檔的命名關係好了,圖片名稱依序是WPW0017602.png、WPW0032102.png、WPW0035102.png、WPW0016902.png、WPW0026202.png、WPW0015C02.png,swf名稱依序是WPW0017602.swf、WPW0032102.swf、WPW0035102.swf、WPW0016902.swf、WPW0026202.swf、WPW0015C02.swf,有沒有發現圖片跟相對應的swf名稱都一樣,只是差在副檔名的不同,醬命名是有用意的,等等當我解說JavsScript時就知道了。
在show()函式中有個參數src,這是當圖片被Click觸發show()函式時,所一起傳入的參數,也就是圖片的src位置。現在我們要播放的swf,所以要得知swf的存放路徑才行,若我們把圖片跟swf存放在同一空間目錄的話,那兩者差別就只是副檔名了,所以現在新增了一個swfSrc的變數來存放從參數src第一字元到‧為止(含)中間的字串並加上"swf"即可。
現在我們已經有swf的路徑了,再來就是產生一個能播放swf的元件EMBED,並設定它的寬高及顯示的位置。EMBED的寬高是以整個Body中目前工作區域中的寬高為準,位置是以整個Body中目前捲軸左端跟頂端為準。
若在wmode設定中選擇「transparent(透名)」,是讓 Flash 影片的背景在支援透明功能的瀏覽器中消失。
OK~到這邊應該都沒什麼問題吧!小小的技巧就能做到讓人驚奇的效果了。有人會想說,那如果要讓進來到這網頁時就自動出現動畫快遞要怎麼改呢?
其實只要在Body載入完時呼叫show()函式就可以了,這部份請自己看下面的範例吧!
範例瀏覽
http://abgne.myweb.hinet....008_1.htmlhttp://abgne.myweb.hinet....008_2.html以上內容於2005/09/27發表在小弟的Blog裡
http://blog.xuite.net/abgne/diary1/4038654