jueves, 29 de mayo de 2008

¿Qué ves cuando me ves? Iframe transparente

Estuve peleando hace un rato con un bendito Iframe, que se me ocurrió poner para mi portfolio online porque quedaba lindo y me permitirá generar toda la "ficha" de proyecto de una sola vez. Como el color de fondo se lo da una background del primer HTML que contiene parte del otro fondo (podrán verlo online en breve), era necesario que el susodicho Iframe fuese transparente, sin color, sin nada. En FireFox quedó monono de una. En Explorer, puaj, me puso un fondo blanco que resultó espantoso. Estuve largo rato estudiando qué había salido mal, y no encontraba ningún error... el CSS asignaba un background:none, el HTML tampoco, el tag de Iframe tampoco... A punto de perder los estribos, busqué en Google y me cansé de mirar foros con casos como el mío cuyas respuestas oscurecían más que aclarar. Hay gente reacia a avivar pichis.

Así fue que, de casualidad y buscando otra cosa (cuando no) encontré la respuesta que buscaba: el tag allowtransparency=true combinado con background-color: transparent.

Supongamos, que tenemos un HTML llamado principal.html que contiene un DIV con una imagen como background, y dentro de ese DIV insertaremos un Iframe, entonces el tag deberá quedar así:

Y en la hoja de estilo de pagina.html, le agregamos la siguiente propiedad a BODY:


Y ahora sí, ¿que ves cuando me ves? El contenido dinámico de pagina.html quedó integrado amorosamente a principal.html, y la página se ve exactamente igual en ambos navegadores sin tener que haber usado hacks.

El maestro Jarandilla me hubiera sacado la duda en un segundo, pero ahora que no está aquí, le dedico este pequeño logro, y lo publico para que todos los iniciados encuentren respuesta a sus dudas.

Y ahora me voy a terminar los htmls que me faltan para completar el bendito portfolio, sean felices y larga vida a los iframes, con o sin transparencias.

-·*’°§ PörTeña §°’*·-.
_

No hay comentarios.: