4

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>

私は、ビデオのロードを待つ必要があることを理解しています。次に、ビデオがロードされた場合は、長さを知り、ビデオとカウントダウンを実行する必要があります。

4

2 に答える 2

7

ビデオオブジェクトによって発生したtimeupdateイベントをリッスンし、残り時間を更新します。

このようなものが機能するはずです:

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

function updateCountdown() {
    var timeSpan = document.querySelector('#countdown span');
    timeSpan.innerText = video.duration - video.currentTime;
}
于 2013-01-24T00:02:43.030 に答える
1

これはあなたのためのトリックをする必要があります

countdown = video.duration - video.currentTime

詳細はこちらをご覧ください

于 2013-01-23T23:42:56.110 に答える