【HTML5】videoタグが超便利！

HTML5のvideoをタグをはじめて使ってみました！

参考になったサイトはこちら。丁寧にまとめてくださっていて、大変助かりました。

再生速度とループの設定－JavaScript入門（HTML5編）

個人的に感動した機能は、２つありました。

(1) 動画の再生時間範囲指定機能

srcで動画ファイルを指定するのですが、ファイル名に続けて、「t=開始時間,終了時間」を指定することができました。開始時間は秒単位で指定します。
この機能により、手動で何度も同じ場面を指定して再生する手間が無くなりそうです。

(2) 2倍速再生、0.5倍速再生機能

javascriptにて、再生速度も指定できるようでした。
ダンス練習なら0.5倍速で、学習サイトなら倍速で成果を上げることができそうですね！！

サンプル

<h3>動画１</h3>
<video id="movie1" src="/mp4/movie.mp4#t=46,75" poster="/img/movie.JPG" controls preload="none" width="460" height="265">
    <p>お使いのブラウザは、HTML5 videoに対応していません。</p>          
</video>

<h3>動画２</h3>
<video id="movie2" src="/mp4/movie.mp4#t=46,75" poster="/img/movie.JPG" controls preload="none" width="460" height="265">
    <p>お使いのブラウザは、HTML5 videoに対応していません。</p>  
</video>


<script type="text/javascript">
    var vid = document.getElementById("movie2");
    vid.playbackRate = 2.0;
  //vid.playbackRate = 0.5;
</script>

これを機会に、どんどんHTML5をマスターしていきたいですね♪