JavaScript para ocultar y/o mostrar una capa.

Vemos que se definen varias variables al comienzo del Script. Esto lo hacemos porque el manejo de las propiedades difieren en cada navegador, por lo que si queremos que sea compatible con Internet Explorer, Firefox y Netscape debemos definir una variable para cada uno de ellos.

El operador condicional ?: devuelve el valor true o false según el navegador utilizado.

Las funciones Ocultar() y Mostrar() cambian la propiedad visibility (o display según el navegador utilizado) a su valor hidden, hide y none (para ocultar la capa/layer, y visible, show y block para mostrar la capa/layer.

Estas dos funciones son llamadas desde el atributo href de la etiqueta <A> que utilizamos como enlace. En ambos enlaces pasamos como parámetro el ID del elemento (<SPAM>) que queremos ocultar/mostrar. Este parámetro lo utilizaremos en la función correspondiente.

Vemos que en el ejemplo se definió un estilo propio al texto de la capa mediante la etiqueta <STYLE>. En ella definimos todas las propiedades y atributos para formatear el mismo a nuestro gusto. Lo mismo podríamos hacer con el elemento capa, definiendo su posición, tamaño, color, etc.

Para poder ocultar la capa / layer mediante un botón de formulario debemos reemplazar el enlace por un botón creado mediante la etiqueta <INPUT> y su elemento button. A éste debemos asignarle en el atributo onClick el valor de la función correspondiente. El ejemplo quedaría así:

<INPUT type="button" onClick="Mostrar(capa)" value="Mostrar capa">
<BR>
<INPUT type="button" onClick="Ocultar(capa)" value="Ocultar capa">

De esta manera cuando se presione sobre cada botón se mostrará u ocultará la capa según corresponda.