Removing the border of an image link while clicking...

Is this possible?

[dnimrodx]

Hello,

Please forgive me if this post should not be here in the first place. But what happens is I was told just 10 mins ago there is a way of removing the annoying (dashed/dotted) border that shows up whenever you click on an image link.

I have tried setting

border="0"

and also defining the style

(style="border-width:0px; border-style:none")

. Needless to say none of these aproaches worked...

Does anyone have a suggestion please?
Thanks alot,

d#Nimrod

[dnimrodx]

Do not bother replying guys! I have figured it out and want to share it with you. So here it goes:

This is a feature only used in Internet Explorer. (it figured)

It can only be de-activated in early versions >v5.5 (which is why it wasn't working with me)
... and to drop the annoying (focus) rectangle, there are three ways (that I know of):

either use CSS and define

border-style: none

; include

border="0"

inside the tag; and finally, you can use

HIDEFOCUS="true"

(also inside the tag), which is an attribute used solely by Internet Explorer.

I hope I was helpful in any possible way,

d#Nimrod

[encyclo]

There is a way... sort of. Up to you to decide whether you want to implement it. Usually, you will see the following suggestion:

<a href="linkhere.html" onfocus="blur()"><img src="pic.jpg" alt="alt text"></a>

This will appear to work, bu there is an underlying problem: if the user is navigating using the keyboard and TABbing through the links, you'll break the link. 1. The user presses TAB, arrives at the link, 2. the link notices it has the focus and promptly gets rid of it. 3. User presses enter to follow the link, and nothing happens. 4. Go to step 1. You've created a loop and ruined the accessibility of your page.

There is a second solution, which solves the loop by only blurring the link when using the mouse:

<a href="linkhere.html" onmousedown="this.onfocus=this.blur" onmouseup="this.onfocus=window.clientInformation?null:window.undefined"><img src="pic.jpg" alt="alt text"></a>

The following code will remove the dotted line from all links on the page:

<script type="text/javascript"> 
var link_nohandler= window.clientInformation? null : window.undefined; 
function link_down() { this.onfocus= this.blur; } 
function link_up() { this.onfocus= link_nohandler; } function link_bind() { 
 for (var i= document.links.length; i-->0;) {  
document.links[i].onmousedown= link_down; document.links[i].onmouseup= link_up; 
 } }  
</script>

Using this method means that a visitor using the keyboard will be able to follow the link correctly. Up to you whether you need this feature enough to use this method. Obviously, it only works when Javascript is enabled.

Note: I didn't write this code, but I've lost the reference. If anyone knows where is came from, I'll happily give credit where its due.