HTML5先行者高级交流群
欢迎加入学习讨论
专注前端,专注网页设计制作及网站开发项目 - (低价承接网站开发项目) QQ:370158739
加入收藏
RSS
首页
JS下载
CSS3手册
Json在线解析
html5教程
网站及特效实例
视频教程
html5资讯
网络编程
html5书籍
HTML5演示
论坛
入门教程
高级应用
滚动新闻
html5实验
javascript特效
Photoshop教程及网页素材
jquery特效
html5视频教程
CSS3视频教程
JS视频教程
JUQERY视频教程
Bootstrap视频教程
html5video
微信服务号开发教程
最新资讯
最新动态
IT动态
ASP编程
PHP编程
正则表达式
AJAX相关
ASP.NET
JSP编程
Flex
脚本加解密
网页编辑器
相关技巧
黑客相关
网页播放器
其它综合
java教程
您的位置
:
首页
>
html5教程
>
高级应用
» 正文
HTML5 video 事件应用示例_html5教程技巧
2015-01-03 22:20:03
[
小
大
]
已经帮助:
人解决问题
使用 onloadedmetadata 事件获取视频的时间长度,使用 ontimeupdate 事件获取视频当前播放的进度,示例代码如下
1、获取视频时间长度
vzSHTML5中文学习网 - HTML5先行者学习网
vzSHTML5中文学习网 - HTML5先行者学习网
当视频载入video后,使用 onloadedmetadata 事件获取视频的时间长度。
vzSHTML5中文学习网 - HTML5先行者学习网
复制代码
代码如下:
vzSHTML5中文学习网 - HTML5先行者学习网
video.onloadedmetadata = function () {
vzSHTML5中文学习网 - HTML5先行者学习网
var vLength = video.duration;
vzSHTML5中文学习网 - HTML5先行者学习网
console.log(vLength);
vzSHTML5中文学习网 - HTML5先行者学习网
}
vzSHTML5中文学习网 - HTML5先行者学习网
vzSHTML5中文学习网 - HTML5先行者学习网
2、当前视频的播放进度
vzSHTML5中文学习网 - HTML5先行者学习网
vzSHTML5中文学习网 - HTML5先行者学习网
当视频开始播放时,可以使用 ontimeupdate 事件获取视频当前播放的进度。当video对象的 currentTime 属性发生改变时触发 ontimeupdate 事件。currentTime 属性是浮点小数,可取到 12 位数的小数位数。
vzSHTML5中文学习网 - HTML5先行者学习网
复制代码
代码如下:
vzSHTML5中文学习网 - HTML5先行者学习网
video.ontimeupdate = function () {
vzSHTML5中文学习网 - HTML5先行者学习网
var vTime = video.currentTime;
vzSHTML5中文学习网 - HTML5先行者学习网
console.log(vTime);
vzSHTML5中文学习网 - HTML5先行者学习网
};
vzSHTML5中文学习网 - HTML5先行者学习网
来顶一下
返回首页
(责任编辑:)
推荐书籍
推荐资讯
html5及css3做的3D小
html5视频应用
友情链接:
联系人:QQ370158739
关于HTML5先行者
-
联系我们
-
广告服务
-
友情链接
-
网站地图
-
版权声明
-
人才招聘
-
帮助