Internet Explorer で a:hover が効かない

今日、この件で苦労したのでメモしておく。
問題はタイトルのとおり。

namazuを使った全文検索CD-ROMを作ろうとしていたところ、まったく本筋ではないところで壁にぶつかった。
HTMLのa要素にマウスが乗ったら色が変わるように、CSSでa:hoverを指定したのだが、これが一向に反映されないのだ。
試しに同じHTMLファイルをFireFoxで開いたところ、難なく色が変わってくれる。

その後、試行錯誤を繰り返し、WEB上の情報を検索した結果、以下のことがわかった。

Internet Explorerでは、a要素に、href属性がなければ、a:hoverでのCSS指定は反映されない。

回避策として、まず考えられるのはa要素に href="#" というような形でhref属性を追加すること。
しかし、これでは当該要素をクリックした際に画面がスクロールしてしまうため、場合によっては都合がよろしくない。
とりあえず、今日のところは、JScriptでonmouseoverとonmouseoutイベントを処理するようにして、マウスが乗った(onmouseover)ところで色を変え、マウスがいなくなった(onmouseout)ところで色を戻すようにした。

ブログ気持玉

クリックして気持ちを伝えよう!

ログインしてクリックすれば、自分のブログへのリンクが付きます。

→ログインへ

なるほど(納得、参考になった、ヘー)
驚いた
面白い
ナイス
ガッツ(がんばれ!)
かわいい

気持玉数 : 2

驚いた
ナイス

この記事へのコメント

この記事へのトラックバック