[CSS]パネルをくるっと気持ちよく回転させるスタイルシート6種 -Fun with CSS

デモはCSS3アニメーションを使用しているので、最新のモダンブラウザでご覧ください。 各パネルをマウスでホバーすると、くるっとします。 Fun with CSS 回転のアニメーションは、左上から順に。 垂直：下方向 垂直：上方向 水平：右方向 水平：左方向 垂直：下方向：半回転 斜め パネルはべた塗りだけでなく、写真画像でももちろん動作します。 Fun with CSS：ネコの画像でもくるっと回転 HTMLはシンプルで、各パネルはdiv要素です。 <div class="front"> <h2>Front</h2> This is on front. </div> スタイルシートはちょっと長いので、下記ページをご覧ください。 Fun with CSSのコード

[kurobuchi]

確かに気持ちいい動き。

[kick178]

見たい猫画像が回転して見れない…

[atsushi1972]

モダンブラウザならこんな表現もCSSでできちゃうのですね。個々の機能は面白いのですが、全体としてうまく使う仕組みがまだ見えてないのですが＞＜

[magpepen]

これはたのしい