可控制的網頁背景音樂


不少網友的主頁上都放置了背景音樂,這給網頁增色不少,但有時候訪客並不喜歡這樣,因為,他在打開你的網頁之前可能正在聽別的音樂,或者是別的原因。這個時候應該給來客一個選擇的機會:停止或暫停背景音樂的播放。 
 如果你的背景音樂是用<embed>方法播放的,那么控制起來非常容易的。Follow me!      
 首先我們需要給出<embed>一個id,這個id就是背景音樂的標識,在你的網頁代碼中它必須是唯一的,也就是,其他元素如果也用了id的話,就不能和它重復,否則會出亂。這有點像有兩個黑馬在一塊,你一叫,兩個都有響應,結果就亂了。記住,id要唯一。      
下面是定義了id的<embed>語句樣式: <embed src="音樂文件地址" type=audio/mpeg hidden="true" loop="true" id="music"></embed>      上面代碼中,我們用"music"來做為背景音樂播放機的標識,往下我們就通過對這個標識進行控制,從而達到控制背景音樂的目的。     
 一般地,用於網頁播放的插件都有對音樂的幾個基本的控制方法:play(播放)、stop(停止)和pause(暫停)。它們的語法約定是:標識.方法(),例如播放音樂的語句是:music.play()。這樣,我們可以設置幾個按鈕,當按鈕被點擊時發出相應的指令。以下就是實現代碼: <form>   <input type="button" value="播放" onclick="music.play()">   <input type="button" value="停止" onclick="music.stop()">   <input type="button" value="暫停" onclick="music.pause()"> </form>
 
幾點說明:
一、關於embed ◇ embed可用的媒體格式比較豐富,可放心使用。但如果該媒體格式所使用的插件不提供play、stop等方法(極少有),那我們的設置是無效的; ◇ type應當指定。但是,盡管指定,它仍然依賴於訪客機器中對媒體文件的關聯設置,比如,訪客將MP3和RealPlay做了關聯,那么,他的機器就會用RealPlay在后台播放背景音樂; ◇ 使用hidden="true"來隱藏播放機比用width=0 height=0效果要理想得多,用后者並不能完全隱藏,不是有一條線就是有一個點出現在網頁里。
 
二、關於input ◇ type="button":不能改動,button是“按鈕”的意思; ◇ value="播放":按鈕上面的說明文字; ◇ onclick:表示鼠標左鍵單擊操作,后面用“=方法”向系統發出指令。
 
以下完整的實例代碼放在<body>和</body>之間: <embed src=http://www.gxblk.com/music/test.mid type=audio/mpeg hidden="true" loop="true" id="music"></embed> <form>   <input type="button" value="播放" onclick="music.play()">   <input type="button" value="停止" onclick="music.stop()">   <input type="button" value="暫停" onclick="music.pause()"> </form>

示例代碼:
<embed src="mp3/juresong.mp3" type="audio/mpeg" hidden="true" loop="true" id="music"></embed> <a href="javascript:music.play()">播放 </a>   <a href="javascript:music.stop()">停止 </a>
 <a href="javascript:music.pause()">暫停 </a>


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM