近有在學(xué)習(xí)html5中video標(biāo)簽(播放器)的使用,這里做一些學(xué)習(xí)筆記,方便自己查閱和記錄,本文是第一篇,將介紹的是使用該標(biāo)簽初始化該做的哪些工作。
網(wǎng)上的教程其實也不少了 w3cschool里面的最為簡單而詳細(xì),那么這幾介紹的是一些更為直接的應(yīng)用。
本文目錄:
1.使用標(biāo)簽
2.加上一些必要參數(shù)
3.自動播放或自動加載
4.規(guī)范播放器
第一步:使用標(biāo)簽
使用的方法很簡單,就是一句代碼:
第二步:加上一些必要的參數(shù),比如播放視頻的路徑、是否顯示控制條
要播放視頻那就必須要視頻的地址,也就是要在標(biāo)簽中設(shè)置src屬性。剛開始的時候做不了自己定義的控制條,那么就先用瀏覽器默認(rèn)的,加上controls即可,于是就變成了這樣:
第三步:讓視頻自動播放或自動加載
用播放器經(jīng)常需要做到的一點就是,頁面加載了就開始播放視頻,那么需要設(shè)置視頻自動播放,也就是設(shè)置autoplay屬性。
有時候為了用戶的一些習(xí)慣卻不需要自動播放,但是為了讓用戶能夠快速能看到視頻,所以需要讓視頻自動加載,那么就需要設(shè)置preload屬性,需要注意的是這個并不會完整的加載這個視頻,而是只會加載前面的一部分。
第四步:讓播放器規(guī)范一點
什么叫讓播放器規(guī)范一點?那就是有控制條(前面已經(jīng)介紹了)、開始播放前看到的畫面,規(guī)定播放器的大小。
播放器如果加載到了視頻是可以在一開始就看到一個初始化的畫面,但是往往會有這樣的要求,給視頻設(shè)置視頻開始看到的圖片(有時候為了吸引觀眾,會搞一張跟視頻關(guān)系不大的圖片,你懂的),或者是因為考慮網(wǎng)絡(luò)問題,在還沒加載視頻的情況下不要顯示一個黑屏給觀眾,這個時候也需要做這么一個設(shè)置,那就是設(shè)置poster屬性即可:
總結(jié):通過這四個步驟,可以完成了一個播放器的基本設(shè)置和使用了,主要是要了解播放器的一些屬性和應(yīng)用的場合,更多的應(yīng)用那就要通過JS來控制了。
標(biāo)簽:黃山 楊凌 德州 內(nèi)蒙古 辛集 蚌埠 撫順 鶴崗
巨人網(wǎng)絡(luò)通訊聲明:本文標(biāo)題《HTML5 video標(biāo)簽(播放器)學(xué)習(xí)筆記(一):使用入門》,本文關(guān)鍵詞 HTML5,video,標(biāo)簽,播放器,學(xué)習(xí),;如發(fā)現(xiàn)本文內(nèi)容存在版權(quán)問題,煩請?zhí)峁┫嚓P(guān)信息告之我們,我們將及時溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡(luò),涉及言論、版權(quán)與本站無關(guān)。