ここでは、CSSだけで実現するポップアップメニューのデモンストレーションを行っております。
CSSには、:hover擬似クラスセレクタや隣接セレクタがあり、これらを組合わせる事で、見出し部分にマウスカーソルを当てるだけでその下に子メニューがポップアップするようにさせる事が仕様上可能となっております。
しかし、CSSの標準に準拠していない少し前のブラウザだと実現させる事が出来ない場合があります。
勿論、今日では実現出来るブラウザの方が多くなりましたので、今回はそれの公開実験を行う事としました。
対応しているブラウザは、以下の通りです。
CSSだけでポップアップメニューを実現しようとしても、旧式ブラウザでは対応出来ません。
主なものを挙げると以下のようになります。
インターネットエクスプローラは、7.0まではCSSの標準を満たしていませんでしたが、7.0は何とか対応可能としました。しかし、6.0以前ではCSSだけではどうしても実現不可能です。
これらの非対応環境に対しては、比較的新しいブラウザであればJAVAスクリプトで実現させる事も不可能ではありませんが、そうでないのであれば、多少表示が崩れるものの閲覧は可能と割り切ると言う事も考えられます。
結論から言えば、現状は対応していないブラウザが減少しつつある過渡期と思われます。このため、対応すべきか否かは判断に任されると言えるでしょう。
具体的な方針も示さずに逃げるのは無責任だと思うので見解を書きますが、制作者としては閲覧が可能であればメニューがポップアップしなくても問題ないと思いますし、ポップアップが出なくてもアクセスの妨げにならないように気を配ればそれだけで良いと思います(つまり、対応出来ない環境で無理にポップアップさせる必要はないと考えます)。
但し、これは強調しておきますが、閲覧が出来ないのは閲覧出来ないブラウザを使う方が悪いと言う発想は言語道断です。閲覧を妨げる行為は仮令どんな理由があろうと手前の怠惰に対しての言い訳以上の何ものでもなく、絶対に許されるものではありません。
現実問題として、平成21年 9月20日現在、既にインターネットエクスプローラ 8.0も配布されている事もあって、IE 6.0の利用者はかなり減少してきているようです。
一部のウェブサーヴィスで既にIE 6.0への対応を取りやめつつあるようで、そうなると一般ユーザのIE 8.0への移行が進むのではないかと思われます。
ただ、減少してきているとは言えどちらも決して絶滅したと言えるほど減少してはいません。
ですが、そんな環境であっても閲覧が出来るようであれば、仮令崩れがあっても問題はないと割り切った方が良いかも知れません。
一応、IE 6.0でも実現出来るよう、JAVAスクリプトも書きましたが、これを用いるべきか、その必要はないと判断すべきかは実際に制作される方の判断次第と言えるでしょう。