2004-11-29

今まで常々

((:<div style="border: 1px solid navy;" onMouseOver="this.style.background='navy'" onMouseOut="this.style.background='transparent'">こういうリンク</div>:))

を見る度うんざりしてた。 「なんでマウスをあわせるとハイライトするのに押せないのか」って叫びそうになるんである。 このリンクは全体が光るけれどテキストの部分しかクリックできない。とても苛々する。 押せないなら光るな、光るなら押せるようにせい。 メタに言えば、アクションしそうなフィードバックを返すならアクション出来て然るべき。

……でもね、これを実現するのはちょっと面倒なのだ。 IE は a 以外の疑似クラスに対応していないし、JavaScript で頑張れば確かに出来るけども HTML 側がかなり汚くなってしまう ((-それでも実際やることになったら自分はこの方法を取るだろうけど-))。 a を display: block にすると言う手もあるけれど、複数のブロック要素を跨ぐような場合 （例えばテーブルの行をまとめてハイライトしたい場合とか）は使えない。

と言うようなことを細々考えていたら。 偶然 a を block として使っている実例を発見したのでメモ。 ((<((:ひぐらしの<span style="color: red">な</span>く頃に検索:))|URL:http://oyashiro.jp/>)) です。 ソースを見てみると、div と span しか無いんで「それはHTMLなの!?」とか 叫びたくなるかもしれんがそれはともかく。 実際に考えていた人がいたのだなぁと感慨。