[CSS]補足情報などの表示に便利なアコーディオン型ナビゲーション

ナビゲーションのラベルの補足テキストなどを表示するのに便利なアコーディオン型のナビゲーションをスクリプト無しで実装するスタイルシートを紹介します。

デモのキャプチャ

CSS Vertical Navigation with Teaser
demo

ナビゲーションの各項目はリスト要素で実装されており、補足テキストの箇所はspanの表示・非表示でコントロールされています。

動作環境は明記されていませんが、IE6/7, Fx3, Op9.6, Safari3で動作しました。
IE5.5でもレイアウトは少し崩れますが、動作しました。

sponsors

top of page

©2024 coliss