Могу ли я сделать обратный отсчет до конца видео 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>

Я понимаю, что нужно ждать загрузки видео, а затем, если видео загружено, нужно знать длину и запустить видео и coundown.

3
user2005679 24 Янв 2013 в 03:34

2 ответа

Лучший ответ

Прослушайте событие timeupdate, запущенное видеообъектом, и обновите оставшееся время.

Примерно так должно работать:

var video = document.getElementById('video');
video.addEventListener('timeupdate', updateCountdown);

function updateCountdown() {
    var timeSpan = document.querySelector('#countdown span');
    timeSpan.innerText = video.duration - video.currentTime;
}
5
Tyler Hughes 24 Янв 2013 в 00:02

Это должно помочь вам

countdown = video.duration - video.currentTime

См. здесь для получения дополнительной информации.

0
Ani 23 Янв 2013 в 23:42