HTML5視頻

2013/01/01 31 網站技術 , HTML

到現在為止,還沒有在網頁上顯示視頻的標準。
今天,大多數視頻都是透過插件來顯示。然而,不同的瀏覽器可能有不同的插件。
HTML5定義了一個新的元素,它指定了一個標準的方式在網頁上:<video>元素嵌入視頻/電影。

<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
以上為基本的視頻原碼,第二行放mp4影片,第三行放ogg影片,第四行放瀏覽器不支援會顯示的內容。
因為不同瀏覽器所支援的影片格式不同,所以需要用多種格式,HTML5影片格式共3種:MP4、WebM、Ogg。

◎<video>屬性說明:
width="(長度單位)":指定影片方塊寬度。
height="(長度單位)":指定影片方塊高度。
audio="muted":影片設為靜音狀態。
autoplay="autoplay":自動播放影片。
controls="controls":顯示影片控制列。
loop="loop":自動重複播放。
preload="preload":讀取頁面時自動載入影片。如果autoplay則沒有作用。
src="(網址)":指定影片位置。
poster="(網址)":可代替影片的圖片位置。

瀏覽器 MP4 WebM Ogg Internet Explorer 9+ YES NO NO Chrome 6+ YES YES YES Firefox 3.6+ NO YES YES Safari 5+ YES NO NO Opera 10.6+ NO YES YES 以上為瀏覽器支援版本。

◎HTML5視頻標籤
標籤 描述 <video> 定義視頻或電影 <source> 定義多個媒體資源等媒體元素。 <track> 定義在媒體播放器中文本軌道。 資料提供:http://www.w3schools.com/html/html5_video.asp

贊助廣告 ‧ Sponsor advertisements
徵信社服務電話| 外遇疑雲| 阿宅來說徵信社故事| 如何手機監聽| 徵信社電話幾號| 徵信價目表費用| 抓姦在床蒐證| 台北立達徵信社| 免費法律諮詢專線| 馭夫術手段| 設計離婚服務| 男友感情挽回| 包二奶氾濫| 抓小三蒐證| 反跟蹤可行嗎| 尋人查址高手| 夫妻協議離婚| 委託外遇蒐證| 丈夫外遇偷腥| 名人外遇新聞| 立案專業徵信社| 婚前調查協助| 離婚扶養費| 汽車定位追蹤| 危險徵信社任務| 免費法律諮詢| 國際徵信公司|
【業界首推立達徵信FB