Una de las diferencias básicas en el soporte de dHTML entre Netscape y Explorer, es la de que este último soporta el nuevo DOM (Document Object Model). El DOM permite que prácticamente todos los estilos de los elementos de una página se puedan tanto leer como escribir en cualquier momento. Esto da una mayor facilidad y potencia al dHTML. No obstante, lograremos hacer lo mismo en ambos navegadores con un poco más de trabajo y usando algunos trucos, así como el objeto document.write para escribir nuevas capas con otros estilos.

Cambiando estilos en Explorer 4.0 con DOM

Se puede modificar cualquier propiedad de los estilos. Para ello bastará con crear la capa y usar la siguiente orden:
micapa.style.propiedad= "valor"

Las propiedades habrá que escribirlas siguiendo la sintáxis de JavaScript. Por ejemplo, para cambiar el estilo y el peso de la fuente, podríamos crear las siguientes funciones que luego podríamos asignar a eventos del ratón como los de "pasar por encima" (onmouseOver) y "marchar" (onmouseOut):

function Llegar2() {
	mitexto2.style.fontStyle= "Italic";
	mitexto2.style.fontWeight= "900";
	}
function Salir2() {
	mitexto2.style.fontStyle= "normal";
	mitexto2.style.fontWeight= "100";
	}

Veámoslo (Recuerda que sólo funciona en Explorer 4.0 o superior).

Cambiar el color de fondo en ambos navegadores

En Netscape para cambiar el color del fondo de una capa habrá que cambiar la propiedad bgcolor del objeto documento:

document.layer["nombrecapa"].document.bgColor = "red"

En Explorer, se puede cambiar la propiedad color de fondo de la capa:

document.all["nombrecapa"].style.backgroundColor = "red"

Para crear un script que funcione en ambos:

function cambiarBGColor(nombrecapa,nestref,color) {
        if (ns4) {
                var capa = (nestref)? eval('document.'+nestref+'.document.'+nombrecapa):
		document.layers[nombrecapa]
                capa.document.bgColor = color
        }
        else if (ie4) {
                document.all[nombrecapa].style.backgroundColor = color
        }
}

Veámos un ejemplo.

Cambiar estilos de texto al pasar sobre ellos

Como dijimos anteriormente, para lograr esto en Explorer bastaría con redefinir el formato de la capa, pero en el caso del Netscape necesitaremos usar un document.write() para sobreescribir la capa con un estilo diferente. Como además el Netscape no permite asignar eventos onMouseOut nada más que a vínculos tendremos que hacer que el texto lo sea.

Vamos a crear un script que funcione con los dos:

ns4 = (document.layers)? true:false
ie4 = (document.all)? true:false

function escribirCapa(nombrecapa,nestref,texto) {
        if (ns4) {
                if (nestref) var capa = eval('document.'+nestref+'.document.'
+nombrecapa+'.document')
                else var capa = document.layers[nombrecapa].document
                capa.open()
                capa.write(texto)
                capa.close()
        }
        else if (ie4) document.all[nombrecapa].innerHTML = texto
}

function llegar(nombrecapa,url,texto) {
        escribirCapa(nombrecapa,null,'<A CLASS="llegar" HREF="'+url+'"
onMouseOut="salir(\''+nombrecapa+'\',\''+url+'\',\''+texto+'\')">'+texto+'</A>')
}

function salir(nombrecapa,url,texto) {
        escribirCapa(nombrecapa,null,'<A CLASS="salir" HREF="'+url+'" 
onMouseOver="llegar(\''+nombrecapa+'\',\''+url+'\',\''+texto+'\')">'+texto+'</A>')
}

Para simplificar, si quieres, puedes bajarte el código anterior en un archivo cambiarformato.js (si usas Netscape pulsa con el botón derecho y elije guardar enlace) y simplemente llamarlo en cualquier página. No olvides definir los estilos A.llegar y A.salir con las propiedades que quieras. Para llamarlo:

<SCRIPT LANGUAGE="JavaScript" SRC=cambiarformato.js>
        </SCRIPT>

Crearemos los estilos a usar:

<STYLE TYPE="text/css">
        <!--
        A.llegar {color:red;}
        A.salir {color:blue;}
        #vinculo1 {position:absolute; left:50; top:50;}
        #vinculo2 {position:absolute; left:50; top:70;}
        #vinculo3 {position:absolute; left:50; top:90;}
        #vinculo4 {position:absolute; left:50; top:110;}
        -->
        </STYLE>

Ahora habrá que crear en la página los textos con los vínculos. A continuación tienes un ejemplo de uno.

<DIV ID="vinculo1"><A CLASS="azul" HREF="#" 
onMouseOver="llegar('vinculo1','#','Texto 1')">Texto 1</A></DIV>

en donde # es el nombre de la página a la que queremos ir al pulsar.

Veámos un ejemplo.

Si lo que queremos es que cambie de estilo (por ejemplo, a negrita o a cursiva, etc) en lugar de cambiar de color, bastará con que en la definición de las clases rojo y azul, pongamos otras propiedades.

Por ejemplo.

---