videoタグを使ってみよう!!

※画像に他意はありません。

videoタグにチャレンジ

さて、今回はhtml5で使用可能になった、videoタグにチャレンジしようと思います。

<video src="なんちゃら.mp4" width="450" height="350" autoplay loop></video>

autoplayなど自動再生させたり、loopで繰り返す属性などがありますが、使い方はほとんどimgタグにそっくりで簡単ですね。

各ブラウザに対応!!

しかし、一部のブラウザではMP4形式の動画を見ることができません。(FirefoxやOperaなど)
なので、以下のように記述することで、MP4に対応していないブラウザでも動画を見ることができるようになります。

<video width="450" height="350" autoplay>
<source src="なんちゃら.mp4">
<source src="なんちゃら.webm">
</video>

Web Mという動画形式こちらはFirefox、Google Chrome、Operaでも利用可能です。
これでほぼ全てのブラウザで動画を見ることが可能になります。
※バージョンによっては見ることができません。

video最後に

以上、videoタグを使ってみよう!!でした。
動画を使ったサイトが増えていますし、どんどん新しい技術を吸収していろんなことにチャレンジしておくと「いざやろう!!」ってなった時に入りやすいと思うので、チャレンジ精神を大事にして今後も精進しようと思います。

ご覧いただき、ありがとうございました。