[英]Countdown to the end of the HTML5 video
Can I make a countdown to the end of the HTML5 video? 我可以倒数到HTML5视频的结尾吗?
<video id="video" width="400" height="225" preload="auto">
<source src="video.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
</video>
<div id="countdown">Video ends after <span>XX</span> seconds.</div>
I understand that a have to wait for the video load, and then if the video is loaded, need to know the length and run video and coundown. 我知道必须等待视频加载,然后如果视频加载,需要知道长度并运行视频和coundown。
Listen to the timeupdate event fired by the video object and update the time remaining. 收听视频对象触发的timeupdate事件并更新剩余时间。
Something like this should work: 这样的事情应该有效:
var video = document.getElementById('video');
video.addEventListener('timeupdate', updateCountdown);
function updateCountdown() {
var timeSpan = document.querySelector('#countdown span');
timeSpan.innerText = video.duration - video.currentTime;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.