メニューの方式を、以前のようにページヘッダに表示されるようにしました。いや、うん、サイドメニューにあるとアレ、目立たないわ。AboutとLibraryしかねぇし。GalleryをLibraryに統合したから仕方ないんだけども。ページ構造的にもメインメニューが最初の方に来るのが正しいしね（CSS関係によりサイドメニューの表示の方がページ構造として先に記述されていた）。
で、カテゴリをまとめて表示するには多すぎるので、ドロップダウン方式でメニューを構成することに。俺の流儀として、リッチクライアントが必要なコンテンツが存在することは仕方ないとしてもメニューなどのインターフェースに対しリッチクライアントが必須というのは頂けない、というのがありまして、ドロップダウンを作るにもJavascriptで実装したくなかったのですよ。そこでCSSでなんとかできないかと探したところ、意外とあっさり解決法が。:hoverという疑似クラスを用いればオンマウス状態のときのスタイルを指定できるので、これで要素の表示・非表示をコントロールすることが出来るのです。リンクに対しマウスを載せた時に、色が変わったり下線が表示されたりというのもこの:hoverで表現されてます。ただ残念なことに、IE6では:hoverはa要素にのみ適用されるので、今回のようなドロップダウンメニューを作るのにCSSだけでは解決できません。けどそんなクリティカルな情報でもないし、別のページからでも辿れるし、リッチクライアントの癖にCSSも正しく読めないようなクソブラウザはｲﾗﾈ( ﾟдﾟ)、ﾍﾟｯ。IE7では見られるんじゃないですかね。確認できないんですけども。
そんなこんなで一日が過ぎていく秋のとある日。こういう微妙な修正が、サイトをいじくる上で一番愉しいかもしれない。
Comment