読者です 読者をやめる 読者になる 読者になる

Life is Really Short, Have Your Life!!

ござ先輩の主に技術的なメモ

IEでアンカー要素の位置判定のような点線の枠を消したい

jquery

画像リンクってみなさんやりますよね!aの中にimgタグ入れるやつ。

Firefoxでは全く出ないんですが、IEではリンク(アンカー要素)に画像を指定するとなぜか点線枠みたいなのが表示されます。

小さな親切、大きなお世話って知ってますか!IE作った人!!!

嘆いていてもしょうがないので、悪名高いIE6でもこの点線枠を消すTipsをメモっておきます。jquery推奨です。

そもそも点線枠を消すやり方は、下記参照。


onfocusでフォーカスが当たるときにフォーカスを外すことで、フォーカスが当たったときに出る点線枠を出さなくするHack。なるほど。

で、ここにあるようにonfocus="this.blur()"って手打ちしてたらキリがないので、jqueryで一撃。

<script type="text/javascript">
jQuery(document).ready(function($) {
	$('a').focus(function(){this.blur();});
});
</script>

なんか遅そうでイヤな第一引数ですが、こうすると全てのa要素に適用されます。

この辺はCSSセレクタなんで、適宜変えてね。範囲絞った方が早いに決まってるだろうから。