[CSS]CSS3の美しいエフェクトを備えたナビゲーション -Circle Navigation Effect

デモページ 写真画像の下の半透明のパネルには画像の説明文とナビゲーション（アローとテキスト）が配置されており、ホバーするとサークル状にアニメーションで拡大しながらサムネイル画像に変わります。 2枚目の画像 [ad#ad-2] 実装 画像ギャラリー自体はjQueryをベースに作られており、ここではナビゲーションのエフェクトの実装方法を紹介します。 HTML ナビゲーション箇所はテキストと画像をa要素で内包します。 <div class="cn-nav"> <a href="#" class="cn-nav-prev"> <span>Previous</span> <div style="background-image:url(../images/thumbs/1.jpg);"></div> </a> <a href="#" class="cn-nav-next"> <span>Next</

[kadokurarara]

この手のアニメーションは今後使う機会が増えそう。ムニュッと拡大して次の画像を見せるナビゲーション。

[keita_i]

マウスオーバーで次の画像のサムネイルを表示

[waku1969]

web

[anpan0829]

メモメモ。

[tsuki-rs]

おぉ。なんか気持ちいいね

[elsamaria]

CSS3の美しいエフェクトを備えたナビゲーション -Circle Navigation Effect