Javascript:撥放/停止音樂

阿瑟 發表



STEP1:【前言】
這次的範例是一個很簡單的Javascript中控制多媒體物件，這次阿得會用midi檔來示範。

STEP2:【內嵌多媒體物件】
Embed基本語法:
<embed src="example/javascript/newyear5.mid">


embed就是一種內嵌多媒體物件的語法，以後還會有<object></object>可以用，這次阿得就先用embed因為比較容易設定，我想這部分就可以省略了，只是內嵌一個midi檔案，路徑...上次說過囉。您跑跑看就知道，如果您用IE的話會顯示一個Media Player的面板，按下三角形鈕就可以撥放(如果您用Netscape的話embed物件必須加上width與height設定)。紅色的的部分您改一下就可以了。

STEP3:【隱藏多媒體物件】
隱藏embed物件:
<embed src="example/javascript/newyear5.mid" hidden="true">


hidden="true"就是不要顯示多媒體物件...這樣不就完全沒有辦法撥放了嗎
*autostart="true"這次的程式碼阿得雖然沒有寫在裡面，但是如果您加上這一段的話，音樂就會自動開始撥放，當然，您沒有辦法使他停下來(除了按下STOP)，加上這個以後就是大家常常說到的背景音樂。
*loop="true"既然都提到背景音樂了，就順便說一下，loop代表的是迴圈，由於您沒有辦法控制這個隱藏的物件，所以加上這一段以後，這個midi檔案就會自動重複撥放。

嘿嘿嘿，一石二鳥，加上上面兩個打星號的語法就是背景音樂了﹗

STEP4:【設定Name】
加上name以便使用Javascript控制:
<embed src="example/javascript/newyear5.mid" hidden="true" name="midi">


name=midi加上了Name，Javascript才能夠控制這個物件(使用Name是因為Netscape只能夠辨別name，ID辨別是IE才有的功能)。

STEP5:【控制語法】
下面有一段Javascript撥放和停止的按鈕:
<embed src="example/javascript/newyear5.mid" hidden="true" name="midi">

<a href="javascript:document.midi.play()" target=_self>撥放音樂</a>
<a href="javascript:document.midi.stop()" target=_self>停止音樂</a>


document.midi.play()，javascript:代表這個不是連結而是Javascript語法，document代表這個網頁，midi就是剛剛我們設定的name，play()就是撥放的意思，了乎﹖就是這麼容易，按下以後就會讓本網頁的name為midi的多媒體物件開始撥放。
document.midi.stop()，略。

STEP6:【範例】
撥放音樂 停止音樂

這首midi開頭有一些停頓，按下去要等一下下才會有音樂喔，自己玩玩看囉﹗
STEP7:【結語】
這次是一個很簡單的多媒體檔案控制，我們下次見囉，其實Javascript就是多用就會了！

最後更新日期: 11/15/2001 1:46:19 AM