【方法步驟】:

在正定等地區(qū),都構(gòu)建了全面的區(qū)域性戰(zhàn)略布局,加強(qiáng)發(fā)展的系統(tǒng)性、市場前瞻性、產(chǎn)品創(chuàng)新能力,以專注、極致的服務(wù)理念,為客戶提供成都做網(wǎng)站、成都網(wǎng)站制作、成都外貿(mào)網(wǎng)站建設(shè) 網(wǎng)站設(shè)計制作按需規(guī)劃網(wǎng)站,公司網(wǎng)站建設(shè),企業(yè)網(wǎng)站建設(shè),成都品牌網(wǎng)站建設(shè),全網(wǎng)營銷推廣,外貿(mào)網(wǎng)站建設(shè),正定網(wǎng)站建設(shè)費(fèi)用合理。
首先下載video.js,百度一下就能找到;
這個是下載后的目錄;
先把要用到的js\css\swf都加載到html頁面上。如:
link href="video-js/video-js.css" rel="stylesheet" type="text/css"
script src="video-js/video.js"/script
script
videojs.options.flash.swf = "video-js/video-js.swf";
/script
加入下面的代碼:
video id="my_video_1" class="video-js vjs-default-skin" controls?? ?preload="auto"width="640"height="480"poster="video-js/my_video_poster.png"?? ?data-setup="{}" ? ? ?? source src="Wildlife.mp4" type='video/mp4' ? ?? /video
只要記住:修改width="640" height="480"來改變視頻顯示大小,修改src="Wildlife.mp4"來改變要顯示的視頻;
然后打開html文件查看效果吧,它有暫停、音量控制、全屏等功能,還有好多其他功能,比如字幕等,這個以后再寫。
【注意事項(xiàng)】:
如果是IE瀏覽器就將視頻替換為傳統(tǒng)的以FLASH形式播放;
解決IE不能播放的問題很簡單。加入:scriptif (navigator.userAgent.indexOf('MSIE') = 0){ document.getElementById("videoDiv").innerHTML='embed src="Wildlife.mp4" autostart="true" loop="true" width="640" height="480" '; } /script;
在信息量越來越大的今天,越來越多的網(wǎng)站重視數(shù)據(jù)信息的多樣化與個性化,隨著多媒體技術(shù)逐漸發(fā)展提高,在線展示視頻、音頻、PPT、圖表等技術(shù)也越來越多地應(yīng)用到了各行各業(yè)中,無論是企業(yè)還是個人,都在改變著自己的網(wǎng)站風(fēng)格。
我們使用html5的video標(biāo)簽,可以不依賴于任何第三方的插件或控件,直接在瀏覽器中實(shí)現(xiàn)視頻播放功能。
在了解了video標(biāo)簽之后,下面我們就使用html5的video標(biāo)簽來實(shí)現(xiàn)視頻播放。
現(xiàn)在,我們打開瀏覽器,看一看具體的效果:
為了更好地兼容各種瀏覽器,你可以為一個video標(biāo)簽添加多個source子標(biāo)簽,每個source標(biāo)簽引用一個不同格式的視頻文件。這樣,html5瀏覽器會自動在這些source標(biāo)簽中從上到下依次尋找并識別出該瀏覽器可以播放的第一個視頻文件并進(jìn)行播放,從而實(shí)現(xiàn)兼容多個瀏覽器的視頻播放功能。
注:html5的video標(biāo)簽?zāi)壳爸恢С植シ?mp4、.ogg、.webm等幾種格式的視頻文件,暫不支持其他格式的視頻文件。此外,不同的html5瀏覽器支持的視頻文件格式也略有不同,這種狀況可能會在未來的html5中得以改善。
通過html5中的video標(biāo)簽添加視頻文件。
1、新建html文件,如圖所示,在body標(biāo)簽中添加video標(biāo)簽,為video標(biāo)簽設(shè)置“src”屬性,屬性值是視頻文件地址,這里以html同一目錄下的“movie.mp4”視頻為例:
2、此時的視頻只會顯示一個封面,并沒有控制按鈕,這時為video標(biāo)簽添加“controls”屬性,如圖所示,不需要添加屬性值,可以看到視頻中出現(xiàn)了常用的控制按鈕:
3、直接插入的視頻顯示寬和高是視頻本身默認(rèn)的寬和高,這時可以給video添加我們想要的寬和高,這里以寬度400和高度300為例,添加屬性“width”,屬性值為“400”,添加屬性“height”,屬性值為“300”:
4、這時視頻默認(rèn)是加載完成后等待用戶點(diǎn)擊播放按鈕再播放,如果需要加載完成后自動播放,可以給video添加屬性“autoplay”,屬性值為“autoplay”,這時視頻加載完成后就會自動播放:
video?src="Screen/video.mp4"?width="790"?height="340"?controls="controls"?id="movie"/video
這是我在我自己做的一個網(wǎng)頁上截下來的代碼,使用html5的video標(biāo)簽
效果截圖
網(wǎng)頁題目:關(guān)于html5視頻代碼的信息
標(biāo)題網(wǎng)址:http://chinadenli.net/article35/dseoesi.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供動態(tài)網(wǎng)站、云服務(wù)器、微信公眾號、電子商務(wù)、網(wǎng)站營銷、網(wǎng)站導(dǎo)航
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)