JavaScriptでHTML5の<video>を操作する方法

HTML5で追加された<video>タグを使うと簡単に動画を表示することができます。

<video id="video" src="video.mp4"></video>

標準では再生や一時停止などを行う操作パネルが表示されていませんが、controlsを追加することで、操作パネルを表示することもできます。

<video id="video" src="video.mp4" controls></video>

この<video>をJavaScriptから操作したい場合は次のような感じで実装できます。

<video>を再生する

var element = document.getElementsById('video');
element.play();

var element = document.getElementsById('video');
element.pause();

他、特定の位置にシークしたり、ボリュームを調整したりといった操作もJavaScriptからできるようになっています。詳細はリンク先などを確認してみてください。