|
分類：WEB前端
時間：
video.js是一個集成HTML5和Flash的開源網(wǎng)頁視頻播放器，video.js自動檢測瀏覽器對HTML5的支持情況，如果不支持HTML5則自動使用Flash播放器。目前有超過200000多的網(wǎng)站正在使用vedio.js，作為網(wǎng)頁視頻播放器。video.js可以很好的解決瀏覽器的視頻播放器樣式的兼容性。
1
2
3
4
5
6
| //如果支持ie8，請引入videojs-ie8.min.js。Video.js 5.0是基于ES5, 但是ie8支持ES3。
<script src="http://vjs.zencdn.net/ie8/1.1.1/videojs-ie8.min.js"></script>//引入vedio.js和樣式<script src="/path/video.min.js"></script>
<script>
//配置本地的video-js.swf路徑
videojs.options.flash.swf = "/path/video-js.swf"；
</script> |
HTML代碼
默認的按鈕在右上角，vjs-big-play-centered類可以設置為居中。poster：設置封面圖片。最好設置MP4、webm、ogg三種格式，這樣大部分瀏覽器都支持了。
1
2
3
4
5
6
| <video id="example_video_1" class="video-js vjs-default-skin" poster="http://video-js./oceans-clip.png" preload="auto" controls="controls" width="640" height="264" data-setup="{}">
<source src="http://video-js./oceans-clip.mp4" type="video/mp4" />
<source src="http://video-js./oceans-clip.webm" type="video/webm" />
<source src="http://video-js./oceans-clip.ogv" type="video/ogg" />
< p class="vjs-no-js">To view this video please enable JavaScript, and consider upgrading to a web browser that < a href="http:///html5-video-support/" target="_blank">supports HTML5 video</ a></ p>
</video> |
標簽：JS插件
來源：網(wǎng)頁視頻播放器video.js
|
