Siempre quise hacer un tutorial - Parte 2

Como mencioné en el post anterior, aun restaba definir como solucionar el problema del header para que aquellos rebeldes que utilizan el Firefox puedan apreciarlo en todo su esplendor. Primero mostremos más gráficamente cual era el problema.

Header en el Windows Internet Explorer:

Header en el Mozilla Firefox:

Pueden notar como el texto en el Firefox es levemente más angosto y es por eso que no coincide con el borde que había creado en la imagen de fondo.

Para solucionar este problema lo que hice fue crear una segunda imagen para utilizar como header y luego a través de un bloque de javascript cambiarlo si el lector está utilizando Firefox. Para crear la imagen utilicé el mismo mecanismo mencionado en la Parte 1.

Luego intenté agregar el bloque de javascript en el Plantilla / Edición de HTML, pero blogger no me lo permitió. Entonces tuve que utilizar una solución no del todo elegante e incorporar el javascript en alguno de los elementos de página de tipo HTML/Javascript. En mi caso utilicé la sección del contador.

El bloque de código incorporado es el siguiente:

<script type="text/javascript"> if ((navigator.appName == "Netscape") && (document.getElementById)) {   if (document.images)   {     var imageLoad = new Image(1,1);     imageLoad.src =        "http://i174.photobucket.com/albums         /w107/KunDota/Blog/header_ff.jpg";   }   var headerDiv = document.getElementById                                ("header");   headerDiv.style.background =         'url("http://i174.photobucket.com/   albums/w107/KunDota/Blog/header_ff.jpg")                    no-repeat left bottom'; } </script>

Concentrémonos en la segunda parte. Lo que hago es almacenar en la variable headerDiv el elemento HTML div que tiene como fondo la imagen del header. Luego simplemente le cambio el estilo para que en lugar de referenciar al header que hicimos antes (al que referencia por defecto), lo haga hacia el header nuevo. El cometido de la primera parte es que la imagen del header sea cargada antes que el resto de las imágenes. Esto no me funcionó pero lo dejé por dos motivos:

1. Tal vez funcione en versiones posteriores.
2. A lo mejor a alguno de ustedes se les ocurre una alternativa que si funcione y me lo hacen saber.

Bueno, el if simplemente es para ejecutar este script sólo si se está utilizando Firefox.

Luego de terminado esto el resultado es el siguiente:

Header en el Windows Internet Explorer:

Header en el Mozilla Firefox:

Con esto concluyo temporalmente el tema del header. ¿Por qué temporalmente? Porque solo lo probé para las últimas versiones del Internet Explorer y del Firefox. No sé que pasa en versiones anteriores o en otros browsers. Por eso le pido a usted, venerable lector, que si utiliza otro browser, me haga saber como se ve el maldito header.