video要素の操作に関する情報(イベント)を得る
video要素には操作に関する次のイベントを得ることができます。
イベント名 | 説明 |
---|---|
progress | 動画を読み込んでいる最中のとき常に発火。 読み込んでいる最中は常に発火。 初回の読み込みやバッファ中に発火するが、canplayイベントの後に1度発火する場合もある。 |
suspend | 動画が読み込み中であるときに発火。 durationchangeイベントの直前に1度発火する。 |
durationchange | 最大再生時間が変更されたときに発火。 loadedmetadataイベントの直前に発火。 |
loadedmetadata | メタ情報の読み込みが完了したときに発火。 |
loadeddata | 動画の読み込みが完了したときに発火。 |
canplay | 再生の準備が完了したときに発火。 初回の読み込みが完了したときに発火するが、currentTimeプロパティの変更が完了した後にも発火する。 |
playing | 再生を開始したときに発火。 |
pause | 再生を一時停止したときに発火。 |
ended | 再生が終了したときに発火。 |
seeking | currentTimeプロパティの値を変更したときに発火。 再生中など自動的に更新されるときは発火しない。 |
timeupdate | 再生時間が更新されているときに発火。 再生中は常に発火する。 |
volumechange | 音量が変更されたときに発火。 |
ratechange | 再生速度が変更されたときに発火。 |
waiting | 再生中に動画の読み込みが遅く、途中で停止してしまったときに発火。 動画の読み込みに失敗して再生しようとしてもできないときにも発火する。 |
サンプルコード
HTML
<video id="video" autoplay>
<source src="media/sample.mp4">
<source src="media/sample.ogv">
<source src="media/sample.webm">
</video>
JavaScript
var videoElem = document.getElementById('video');
videoElem.addEventListener('loadedmetadata', function() {
videoElem.playbackRate = 0.75;
});
- ※ window.onloadではいくつかのイベントが発生しません。
この場合はDOMContentLoadedで発生するようになります。
(progress, durationchange, loadedmetadata, loadeddataなど)