« 被遺忘的 Blog 軟體, Greymatter | 首頁 | Windows 系統磁區爆滿最罕見的一個原因 »

2005年02月23日

Flash 水滴特效應用教學


很酷吧! 還可以用滑鼠游標撥弄水滴喔!

無意間在中國大陸的網站上看到的 Flash 特效, 還蠻好玩的

但是找不到理想的 Sample Code, 所以就自己寫了一個:

<html>
<head>

<script language="javascript">

function fn_sd() {

document.getElementById("sd").style.width = document.getElementById("mypic").width;
document.getElementById("sd").style.height = document.getElementById("mypic").height;
document.getElementById("sd").style.left = document.getElementById("mypic").offsetLeft;
document.getElementById("sd").style.top = document.getElementById("mypic").offsetTop;

}

</script>

</head>
<body onload="fn_sd()">

<img border="0" src="sd_sample.jpg" width="320" height="240" style="position:relative" id="mypic">

<embed src="sd.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" menu="false" wmode="transparent" style="position:absolute" id="sd"></embed>

</body>
</html>

 

《說明》

因為圖片和水滴 Flash 是兩個獨立的物件, 而水滴 Flash 必須整個覆蓋到圖片的上方才能完成“圖片上有水滴”的效果, 所以必須將水滴 Flash 物件設定為“絕對位置”(position: absolute), 並由 JavaScript 於網頁載入後, 把水滴 Flash 物件大小設定成跟圖片一樣, 再移動到圖片的位置, 就能產生“圖片上有水滴”的效果囉!

程式中的黃色字串是您會修改到的部份, 其他的照寫就行了. 如果您看不到水滴特效, 請先安裝 Flash Player.

以上的程式內容可同時適用 Microsoft Internet Explorer 與 Mozilla Firefox.

 

《下載》

水滴 Flash (請按右鍵“另存目標”)

Posted by Jamyy at 2005年02月23日 14:24

Trackback Pings

TrackBack URL for this entry:
http://cha.homeip.net/cgi-bin/mt/mt-tb.cgi/49

Comments

都唔係你原創的=_=
毋扮代表啦

Posted by: reherhtte at 2006年10月13日 19:49