前の記事 ≪：サイトをクシャクシャにしてしまうPhotoShopチュートリアル
次の記事 ≫：ニコニコ動画スクレイピング用ライブラリ「phpNico」

CSSだけでアコーディオン風ＵＩを実現するサンプル

2008年04月11日-はてなブックマーク

スポンサード リンク
The CSS-Only Accordion Effect - CSSnewbie

CSSだけでアコーディオン風ＵＩを実現するサンプル。
通常、アコーディオンを実装する場合はJavaScriptが必要ですが、PureCSSで実現したものが公開されています。



:hover の際に高さを変えるというテクニックを使っているようで、沢山の情報をコンパクトにまとめられる魅せ方として使えそう。
当然アニメーションしませんが、サクっと軽く動作する感じもなかなかよいですね。

関連エントリ
関連の記事検索：CSS
スポンサード リンク

By.KJ : 2008年04月11日 10:08 ブックマークに追加する livedoor Readerで購読 Twitterに投稿

間違いの指摘をしていただける方はメール、あるいはTwitter/FBでお願いします(クリック)