2010-02-14

CSSをやりすぎた

a:hoverの際、背景色を変更するようにしているが、丸角を使ってみたくなった。

まてよ、せっかくだから、文字サイズを大きくしてみるのも、面白そうだ。

その結果、こうなった。このブログのリンクにマウスカーソルを当てると、面白いことになる。これは、人によって好みがあると思う。続けるかどうかは未定。border-radiusはともかく、マウスカーソルの当たっている要素の背景色やフォントサイズを変えるのは、別に目新しい機能ではない。そういうサイトが少ないというのは、あまり好まれないのだろうか。わたしは、マウスカーソルを当てているリンクの背景色が変わってくれた方が、分かりやすくていいのだが。

ちなみに、一番上のナビバーは、インラインフレームで実装されているため、変わらない。

5 comments:

Unknown said...

例えば右のwindowsをクリックしようとすると逃げるので,このままでは問題でしょう.
リンクされた文字列の中心を維持したまま,その場で拡大し,周囲の文字列の上に重なるようにするべきだと思います.
まあ,マウスカーソルの下にあるオブジェクトを拡大するのはUI設計上のありがちな失敗なのでおすすめしませんが.

Anonymous said...

文字が大きくなって配置がずれると結構使いづらいかと思われます。

江添亮 said...

とりあえず、フォントサイズの変更と、paddingを取りやめ。

os0x said...

outlineってのがありますよ。
Mozillaなら-moz-outline-radiusで角丸もできます。
ただ、WebKitはoutlineのradiusには対応してないみたいです。

江添亮 said...

outline-radiusは、W3Cの規格に見あたらないので、使いたくありません。