h5 audio 和 video

標籤：

html5音頻和視頻的用法

音頻標籤audio和視頻標籤video用法和其他html標籤一樣，如：

<audio controls src="johann_sebastian_bach_air.mp3"></audio>

但是由於各個瀏覽器支援的轉碼器不一樣，所以可以配合source來相容，如：

<video controls>    <source src="Intermission-Walk-in.ogv"></source>    <source src="Intermission-Walk-in_512kb.mp4"></source></video>

上述代碼的意思就是，如果瀏覽器支援ogv格式就用ogv格式的，不支援就用MP4。

 

audio和video中的媒體元素：

controls : 顯示或隱藏使用者控制介面

autoplay : 媒體是否自動播放

loop : 媒體是否迴圈播放

currentTime : 開始到播放現在所用的時間

duration : 媒體總時間(唯讀)

volume : 0.0-1.0的音量相對值

muted : 是否靜音

autobuffer : 開始的時候是否緩衝載入，

autoplay的時候，忽略此屬性

 

paused : 媒體是否暫停(唯讀)

ended : 媒體是否播放完畢(唯讀)

error : 媒體發生錯誤的時候，返回錯誤碼 (唯讀)

currentSrc : 以字串的形式返回媒體地址(唯讀)

除了以上屬性之外，video還有幾個特性：

poster : 視頻播放前的預覽圖片

width、height : 設定視頻的尺寸

videoWidth、 videoHeight : 視頻的實際尺寸(唯讀)

 

還有三個方法：

play() : 媒體播放

pause() : 媒體暫停

load() : 重新載入媒體（當改變了標籤的src的時候，需要重新載入才會生效）

 

相關事件名稱：（感覺用的也不多，只能用的時候再去查了）

loadstart  progress  suspend  emptied stalled play pause loadedmetadata loadeddata waiting playing canplay canplaythrough seeking seeked timeupdate ended ratechange durationchange volumechange

另外canvas的drawImage方法的第一個參數也可以是視頻！

h5 audio 和 video