Este molesto comportamiento del navegador de Microsoft es particularmente antiestético cuando se utiliza un mapa poligonal de coordenadas que llama a funciones Ajax (por lo que no abandonamos la página que contiene el enlace clicado). Por ejemplo:
Aunque a simple vista parece una tontería, la realidad es que se puede perder mucho tiempo intentando eliminar dicho borde punteado a través de CSS y luego a través de Javascript mediante complicados gestores de eventos.
Sin embargo, una vez conocido el truco, en realidad es bastante sencillo. La clave está en el hecho de que dicho borde se presenta sobre el enlace activo (el último que ha recibido el focus) por lo que lo que se debe hacer es quitar el foco de atención (focus) del objeto sobre el que hemos hecho click, en el mismo instante en el que se fija dicho foco de atención.
Los elementos clave de la solución son:
- Método para quitar el foco de un objeto : objeto.blur();
- Evento al que debemos estar atentos : objeto.onFocus();
Personalmente prefiero realizar el truco utilizando jQuery, que facilita la elección del elemento o elementos sobre los que deseamos actuar, por lo que el código que realiza el la magia sería algo así:
$(".elementos_sobre_los_que_actuar").focusin(function(){ $(this).blur(); });
Si se prefiere utilizar Javascript puro, la selección del elemento o elementos sobre los que actuar debe hacerse de manera más artesanal utilizando las funciones getElementById o getElementsByTagName y bucles para recorrer los arrays devueltos, pero la idea es la misma.