2015-10-13

滑鼠滑過物件發出短而急促的聲音

不論你用 html5 在開發遊戲、活動網頁或是具多媒體功能的影音網站,很可能會面臨一個問題:「滑鼠移到一個物件上時,該如何發出像是鏘鏘鏘那樣短而急促的聲音?」

我之前嘗試過用 audio 的 tag 但是成效不彰,網路速度一慢會很延遲,約莫0.5秒才會跑出聲音來,達不到我們要的「立即發出聲音」的效果。

用中文搜尋類似問題但似乎找不到相關文章,到 Stackoverflow 上找到一篇很棒的解答,他的解法如下:

var snd = new Audio("file.wav");
snd.play();

以 javascript 呼叫這個 audio API 來用,要滑過時播放聲音(onMouseover),或是點一下播放聲音(onClick),都可以自由應用。

參考網址如下: http://stackoverflow.com/questions/1933969/sound-effects-in-javascript-html5

希望能把更多遇到的網頁技術問題打成文章,讓更多朋友更容易找到相關知識,一起加油學知識!