最新消息:嗨,新朋友,很高兴认识你,欢迎来到我的博客。更好的阅览效果,请用Firefox,Chrome,Opera等浏览器.

video.js免费全能的HTML5播放器

video.js插件

下载页面,及简介:

http://wordpress.org/plugins/videojs-html5-video-player-for-wordpress/installation/

使用效果展示:

[videojs mp4=”http://video-js.zencoder.com/oceans-clip.mp4″ ogg=”http://video-js.zencoder.com/oceans-clip.ogg” webm=”http://video-js.zencoder.com/oceans-clip.webm” poster=”http://video-js.zencoder.com/oceans-clip.png” preload=”auto” autoplay=”false” width=”640″ height=”264″ id=”movie-id” controls=”true”][track kind=”captions” src=”http://example.com/path/to/captions.vtt” srclang=”en” label=”English” default=”true”][/videojs]

html模式编写代码:(实际使用时请去除#)

[#videojs mp4="http://video-js.zencoder.com/oceans-clip.mp4" ogg="http://video-js.zencoder.com/oceans-clip.ogg" webm="http://video-js.zencoder.com/oceans-clip.webm" poster="http://video-js.zencoder.com/oceans-clip.png" preload="auto" autoplay="false" width="640" height="264" id="movie-id"  controls="true"][track kind="captions" src="http://example.com/path/to/captions.vtt" srclang="en" label="English" default="true"][#/videojs]

引用网易的视频,HTML5效果

地址来源: http://v.163.com/special/opencourse/crimefiction.html 第一集.
[videojs mp4=”http://mov.bn.netease.com/mobilev/2012/12/K/0/S8I7SEJK0.mp4″ poster=”http://img2.cache.netease.com/video/2012/12/20/20121220101502af1f6.jpg” preload=”auto” autoplay=”false” width=”640″ height=”360″ id=”movie-2″ controls=”true”][/videojs]

使用效果:

目前除了视频字幕意外,其他正常,或许是我更改了太多的代码导致字幕失效,其他来说video.js是非常不错的,值得一试,支持html5 video的播放器默认使用html5,如果不支持html5 video的则调用flash播放.兼容了大部分播放器.用她来展示视频,令大家眼前一亮.

 移动设备二维码阅读
┃文章档案信息:
┃本站文章除注明转载外,均为本站原创或编译
┃欢迎任何形式的转载,但请务必注明出处,尊重他人劳动成果,共创美好博客家园.
┃声明: 本文采用 BY-NC-SA ( 署名,非商业性使用,相同方式共享 )协议进行授权
┃转载请注明:转载来源自: 互联网新鲜事
┃本文标题: video.js免费全能的HTML5播放器
┃本文网址: http://www.vgg.me/wordpress/video-js-free-almighty-html5-player/
友荐云推荐
【上篇】:

与本文相关文章