> Manuales > Taller de Javascript

Como hacer un Javascript para evitar que se muestre la URL en la barra de estado del navegador (status bar) al pasar el ratón por encima de un enlace.

Cuando ponemos el ratón encima de un enlace se muestra en la barra de estado del navegador la URL a la que va dirigido. Esto es algo que resulta muy útil cuando navegamos, porque podemos ver, antes de pulsar el enlace, la dirección a la que va a dirigirnos el navegador si hacemos clic. Pero por muy útil que resulte a los navegantes, a veces los webmaster por unas razonas u otras preferimos que no se vea la URL a la que va a enviarnos un enlace al poner el ratón encima.

Con Javascript podemos alterar el texto que aparece en la barra de estado del navegador en cualquier momento, así que será ideal para esconder el texto que aparece en la barra de estado.

Nota:La decisión de eliminar la URL que aparece en la barra de estado al ponerse encima de un enlace es una mala idea desde el punto de vista de la usabilidad. Todos utilizamos esa información para tener una referencia y eliminarla puede ser molesto para el visitante.

Tenemos dos maneras de esconder el texto de la barra de estado. La primera sería modificando la etiqueta del enlace, pero tendríamos que hacerlo enlace a enlace para todos los que se desee. También mostraremos un modo de hacer esto para todos los enlaces de la página a la vez.

Esconder el texto de la barra de estado de enlace a enlace

Simplemente vamos a asignar un comportamiento cuando se pose el ratón encima de un enlace y otro comportamiento para cuando se salga del enlace.

<a href="http://www.guiarte.com" onmouseover="window.status='Guiarte, sitio de turismo y arte';return true" onmouseout="window.status='';return true"> Guiarte.com

Si vemos esta etiqueta del enlace se comprobará que tiene dos eventos definidos:



La ventaja de este modo es que podemos poner un texto distinto en la barra de estado para cada enlace de la página. Como decíamos, la desventaja es que tenemos que hacerlo en cada enlace que queramos evitar que se vea la URL.

Se puede ver un ejemplo en una página aparte.

Nota:En la configuración predeterminada de Firefox no se permite alterar el texto de la barra de estado, por lo que este script no cambiará ese texto. Pero como tenemos el "return true" en el manejador del evento, al menos evitará que se vea la URL del enlace.

Ocultar el texto de la barra de estado para todos los enlaces

Ahora veamos otro método de hacer esto, de una vez para todos los link que haya en la página. Simplemente vamos a hacer un código para borrar el texto de la barra de estado, que se va a ejecutar indefinidamente cada intervalo de tiempo. Así, aunque aparecerá la URL del enlace en la barra de estado durante unos instantes, nuestro código se ejecutará cada poco para borrarlo.

Veamos la siguiente sentencia Javascript:

setInterval ("window.status = ''",10);

Esto es una llamada al método de window setInterval(), que sirve para ejecutar un código javascript indefinidamente en intervalos definidos. El primer parámetro es la instrucción que va a ejecutar window.status = '', que sirve para borrar el texto de la barra de estado. El siguiente parámetro son los milisegundos que tienen que transcurrir entre ejecuciones de la sentencia, en este caso 10 milisegundos.

Si ponemos esa instrucción en un script en cualquier parte de la página, preferiblemente en la cabecera, haremos que desaparezca lo escrito en la barra de estado en cuestión de instantes.

<script language="JavaScript">
setInterval ("window.status = ''",10);
</script>


Se puede ver en funcionamiento el script aquí.

Nota: En la configuración por defecto de Firefox no se permite cambiar el texto de la barra de estado, por lo que este script no parecerá tener ningún efecto.

Para encontrar más información sobre cómo cambiar esta configuración de Firefox consultando la FAQ: ¿Por qué no se cambia el texto de la barra de estado en Firefox con Javascript?

Conclusión

Aunque el texto de la barra de estado es útil, tal vez prefiramos que no aparezca, o que se muestre un mensaje personalizado. Espero que estas dos soluciones sean útiles para esos casos.

Miguel Angel Alvarez

Fundador de DesarrolloWeb.com y la plataforma de formación online EscuelaIT. Com...

Manual