HTML5 & CSS3デモ

HTML5 & CSS3のみで構成したシンプルなデモです。
SafariまたはChrome Dev版の最新バージョンでご覧下さい。
ソースを見ていただくとシンプルなのがおわかりいただけます。

video要素

HTML5から定義されたvideo要素をつかってビデオを表示しています。
iPhoneで撮ってmov→mp4にしたものです。
自動再生・ループにしていますが、ループしない場合はリロードしてみてください。

CSS3のアニメーション

CSS3のtransitionプロパティとopacityプロパティを使って、:hoverでimg要素をフェードアウトさせています。
マウスカーソルを重ねてみてください。

CSS3のアニメーション用サンプル画像