在HTML5標準網頁裡面,我們可以運用audio標籤來完成我們對聲音的呼叫及播放。以下是最常被看到的運用HTML5三種基本格式:
1.最少的程式碼
<audio src="song.ogg" controls="controls"></audio>
2.帶有不相容提醒的程式碼
<audio src="song.ogg" controls="controls"> Your browser does not support the audio tag. </audio>
3.盡量相容瀏覽器的寫法
<audio controls="controls"> <source src="song.ogg" type="audio/ogg"> <source src="song.mp3" type="audio/mpeg"> Your browser does not support the audio tag. </audio>
在HTML5 標準出現以前,程式設計師無法想使用標籤一樣,輕鬆的播放音訊檔案。 HTML5為解決這個問題,提供了一個新的標籤
HTML5
HTML5
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>HTML5音频播放器 |HTML5 audio</title> </head> <body style="padding:0px;margin:0px;text-align:center;"> <audio src="see-you-again.mp3" controls="controls" preload="auto" autoplay="autoplay" loop="loop"> 您浏览器不支持HTML5音频播放器 </audio> </body> </html>
#audio 可腳本控制的特性值:
autoplay 自動播放已經加載的的媒體文件,或查詢是否已設置為autoplay
loop 將媒體文件設置為循環播放,或查詢是否已設置為loop
currentTime 以s為單位返回從開始播放到目前所花的時間,也可設定currentTime的值來跳到特定位置
controls 顯示或隱藏使用者控制介面
volume 在0.0到1.0間設定音量值,或詢問目前音量值
muted 設定為靜音#muted 設定為靜音
autobuffer 設定為靜音
##toplay此特性對於這些屬性,主流的瀏覽器都支援。可別以為就沒有了相容性,在音訊播放串流中,有兩個陣營。 firefox 和 opera 支援 ogg 音頻,safari 和 ie 支援 mp3.幸好Google的chrome都支援。 ###以上是html中