html5播放工具(前端开发一个开源)
Video.js是一个web HTML5视频播放器。它支持HTML5和Flash视频,以及YouTube和Vimeo(通过插件)。它支持视频在桌面和移动设备上播放。这个项目是2010年中期开始,超过40W网站使用该播放器,支持所有现代浏览器及IE8。Video.js拥有丰富的API文档,内置多种方法、事件、语言、配置选项等,功能也相当强大。
https://github.com/videojs/video.js
下载文件后放到项目任意位置,并引入插件的js和css即可,也可以使用CDN托管直接使用,在页面<head>中添加以下标签。
想要兼容IE8需要额外引入一个js文件。
接下来,使用Video.js创建一个简单的<video>元素,但该元素中额外需要data-setup属性。这个属性至少必须有一个“{ }”,它可以包括任何Video.js选项——确保它包含有效的json 。
controls:控制条;
prload:预加载;
poster:最初的显示的图片;
data-setup:支持用json来设置一些参数;
source:视频资源;
当页面加载时,Video.js会发现这个元素,并自动设置。
如果你不想使用自动设置,你可以移除data-setup属性并使用videojs方法初始化一个<video>元素。
该方法支持传入3个参数,①<video>元素的id;②videojs配置参数json对象;③videojs准备好后的回调函数。
设置多种视频播放方式(如使用flash),只需设置techOrder属性,在<video>元素或者javascript中都可以设置。
<video>元素
javascript
该属性配置的是播放方式使用顺序,这里的意思是优先使用html5播放,不行再使用flash播放,除此之外还能设置其他播放方式。
如果你需要视频列表,可以使用以下插件
https://github.com/brightcove/videojs-playlist
支持自定义控制条:
https://codepen.io/heff/pen/EarCt
想要了解更多功能请前往官方网站,有相当丰富的文档、使用方法。
官方网站:
http://videojs.com/
API文档:
http://docs.videojs.com/
,
免责声明:本文仅代表文章作者的个人观点,与本站无关。其原创性、真实性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容文字的真实性、完整性和原创性本站不作任何保证或承诺,请读者仅作参考,并自行核实相关内容。文章投诉邮箱:anhduc.ph@yahoo.com