本文摘自PHP中文网,作者不言,侵删。
这篇文章给大家介绍的内容是关于html5 video如何实现实时监测当前播放时间(代码),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。html:
1 2 3 4 | < video id = "video" controls autoplay = "autoplay" muted>
< source src = "" type = "video/mp4" />
Your browser does not support the video tag.
</ video >
|
js:
1 2 3 4 5 6 7 8 9 10 11 12 13 | //监听播放时间
var video = document.getElementById('video');
//使用事件监听方式捕捉事件
video.addEventListener("timeupdate",function(){
var timeDisplay;
//用秒数来显示当前播放进度
timeDisplay = Math.floor(video.currentTime);
console.log(Math.floor(video.currentTime))
//当视频播放到 4s的时候做处理
if(timeDisplay == 4){
//处理代码
}
},false);
|
相关文章推荐:
阅读剩余部分
相关阅读 >>
详解h5新属性audio音频和video视频的控制代码实例
HTML5 meter标签是什么意思?HTML5 meter度量衡如何改变颜色详解
HTML5实现分层屏幕适配
HTML5 history模式是什么
h5视频中背景音乐如何自动播放
HTML5新增结构:html主体结构和非主体结构的介绍
什么是 websocket?深入理解HTML5中websocket
详解HTML5网络拓扑图整合openlayers实现gis地图应用(图)
HTML5中<template>标签的详细介绍(图文)
HTML5 source标签怎么用?HTML5 source标签属性介绍
更多相关阅读请进入《HTML5》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » html5 video如何实现实时监测当前播放时间(代码)