[CSS]CSS3アニメーションを美しく使ったUIエレメントを作成するチュートリアル

通常時は画像が配置されたパネルで、ホバー時には元画像に重ねて、半透明のアニメーションで情報を見せる「Dribbble」風のエフェクトを実装するスタイルシートを紹介します。 本家よりこっちの方がかっこいいかも。 Using CSS3 Animations to Build a Sleek Box UI [ad#ad-2] デモ 実装 デモ デモではCSS3に対応したブラウザ、Firefox4+, Chrome, Safari, Opera, IE9+でご覧ください。 ホバー時 実装 HTML パネルはdiv要素で実装し、画像やホバー時のコンテンツを内包します。 <div id="container"> <div class="boxxy"> <a href="http://dribbble.com/shots/489532-Banking-App" target="_blank" class

[orangewaffle]

CSS3アニメーションを美しく使ったUIエレメントを作成するチュートリアル | コリス

[candykebin]

これはうつくしい

[harchika]

dribble風エフェクト

[tsuki-rs]

CSS3めんどくさ！

[hiroshi_revolution]

CSS3アニメーションを美しく使ったUIエレメントを作成するチュートリアル | コリス

[nao14115]

CSS3アニメーションを美しく使ったUIエレメントを作成するチュートリアル

[Donca]

✔ [CSS]CSS3アニメーションを美しく使ったUIエレメントを作成するチュートリアル