Entry
How do I get rid off the dashed focus border IE (and NN6) draw around clicked links?
Dec 13th, 2002 12:27
Klaus Bolwin, Martin Honnen, Andreas Reuterberg,
It seems that calling
<ONCLICK="this.blur()
removes the focus and thereby the border. Some people swear on not just
blurring from the link but setting focus somewhere else but I found the
above to be reliable. Anyway here are some links to test with
<HTML>
<HEAD>
</HEAD>
<BODY>
<A HREF="#"
ONCLICK="alert('link action'); if (document.all ||
document.getElementById) this.blur(); return false;"
>
link1
</a>
<BR>
<A HREF="#"
ONCLICK="alert('link action'); if (document.all ||
document.getElementById) this.blur(); return false;"
><IMG SRC="http://www.faqts.com/symphony/local/brands/faqts/javascript-
faqts.gif" BORDER="0"></a>
<BR>
<A HREF="javascript: void 0"
ONCLICK="alert('link action'); if (document.all ||
document.getElementById) this.blur(); return false;"
>
link1
</a>
<BR>
<A HREF="javascript: void 0"
ONCLICK="alert('link action'); if (document.all ||
document.getElementById) this.blur(); return false;"
><IMG SRC="http://www.faqts.com/symphony/local/brands/faqts/javascript-
faqts.gif" BORDER="0"></a>
<BR>
<A HREF="http://javascript.faqts.com" TARGET="_blank"
ONCLICK="if (document.all || document.getElementById) this.blur();
return true;"
>
link1
</a>
<BR>
<A HREF="http://javascript.faqts.com" TARGET="_blank"
ONCLICK="if (document.all || document.getElementById) this.blur();
return true;"
><IMG SRC="http://www.faqts.com/symphony/local/brands/faqts/javascript-
faqts.gif" BORDER="0"></a>
<BR>
<A HREF="javascript: void 0"
ONCLICK="if (document.all || document.getElementById) this.blur();
return false;"
ONDBLCLICK="alert('link action'); if (document.all ||
document.getElementById) this.blur(); return false;"
>
link1
</a>
<BR>
</body>
</html>
Note that IE5.5 provides a special attribute
HIDEFOCUS
for page elements to avoid the focus border. So for IE5.5 you can use
<A HREF="http://Javascript.FAQTs.com" HIDEFOCUS>
to avoid the border.
The simplest way to suppress the dashed focus borders is offered by
Mozilla using CSS:
:link:focus, :visited:focus {-moz-outline:0px;}