有網友問說是否能在按鈕或是圖片按下時有音效?這種效果大多是跟Flash結合在一起,若只用JavaScript來做的話是比較少見,不過要用JavaScript來做的話並不難。
有兩種比較簡單的方法來做到這樣的效果,先來介紹第一種。
第一種是用Embed,方法就跟網頁也有動畫快遞的方法一樣,在Div裡面放入一個Embed。
讓我們先來看Body裡面的Code:
我放了一個按鈕、一張圖片及一個超連結,其中按鈕跟超連結被Cilck時跟圖片被滑鼠指到時都會觸發playSound()函式,並帶入不同參數;最後一個Div是用來放制Embed用的(跟網頁也有動畫快遞的方法是一樣的)。
接著就是JavaScript:
宣告了一個music陣列用來存放音效檔案的路徑,因為我把他跟網頁放在同一目錄下,所以寫成醬就可以了。playSound()函式只是在Div中放置一個Embed,比網頁也有動畫快遞的寫法更簡單吧。
醬就能在按鈕跟超連結被按下時及圖片被滑鼠指到時出現音效了,這些Event都可以依自己的需求來改,看是要用onClick、onMouseOver或onDblClick什麼都行,也可以在計算字(元)數中增加當字數超過限定時出現音效呢!
不過有沒有覺得當觸發Event時,播放音效的時間有點慢的感覺,這是因為Embed還要再載入音效的關係。所以還有另一種方法來改善這問題。
第二種是用bgSound,這屬性是用來替網頁加背景音樂用的,我們也可以用來播放音效。
Body裡面的Code跟第一種有點不一樣:
用了bgSound來取代原先的Div,bgSound中的src屬性為音樂的路徑,loop表示重覆播放幾次。
再來看JavaScript:
這邊只有改playSound()函式,只要指定bgSound的src就可以了。怎樣~應該是比第一種分法更EZ了吧。試著執行後,應該會發現當觸發完Event後出現音效的時間比第一種更即時了吧。
歡迎大家提供下載音效的網站:
http://sound.f....net/範例瀏覽:
http://abgne.myweb.hinet....011_1.htmlhttp://abgne.myweb.hinet....011_2.html以上內容於2005/10/09發表在小弟的Blog裡
http://blog.xuite.net/abgne/diary1/4112955