背景全面にムービーを使ったWebページをよく見かけるようになりました。 どうやって実現させるかの方法については、検索するとネット上にたくさん情報があがっています。紹介されている方法によって、見え方や動作にどんな違いがあるのか。それを確認しようとデモページを作ってみました。 同素材を使って手法ごとの特徴と背景ムービーの見え方を比較して、その後背景全面ムービーにはどのようなものが適切か感じたことを報告します。 1 ムービーデータを用意 背景全面ムービーを設置する方法を紹介しているページでは、ほとんどがスクリプトとコードの紹介で完結しています。今回はデモページの形にしたかったので、仮に設定したテーマにマッチするムービーを自分で撮影することにしました。手持ちのスマートフォンでもHDクオリティのムービーが撮影できる時代なのはいいですねー。iPhone5sのカメラで撮影したムービーデータを、10秒ちょ
![背景全面動画のページ:jqueryプラグイン使い比べ](https://cdn-ak-scissors.b.st-hatena.com/image/square/8c01c4a76352377badcf105e981c991716fab76f/height=288;version=1;width=512/http%3A%2F%2Fwww.ariz.jp%2Fgarage%2Fdemo%2Fbgvideo%2Fimg%2Fogpimg.png)