最近ではスクリプトでHTML上でも様々な動きを実現できるようになっていますが、今日紹介するのはスクリプトを一切使わずCSSのみで実現するアコーディオン「Concertina menu」です。

上記の画像は投じている時の状態です。スクリプトのような滑らかな表現みたいな所はさすがに実現は出来ませんが、見事にアコーディオンをCSSのみで実現しています。

詳しくは以下

↑開いている時のスクリーンショット

アコーディオン部分にはテキスト以外の要素も自由に配置することができます。動作環境は、IE6, IE7, Firefox, Opera, Safari(PC)となっています。スクリプト以外でこういった仕掛けをしたいかたは一度試してみてはいかかでしょうか？

ソースは今の所パッケージでは公開されていなく、zipファイルで欲しければ、メールをくださいと書かれていますので、どうしても気になった、もしくは実装したいと言う方はコンタクトを取ってみてください。

Stu Nicholls | CSSplay | Cross browser concertina menu using only css