Nuevo PNG fix, mas sencillo que nunca.
Escrito por Marc | Archivado en Desarrollo web, Tips | 381 veces visto.
Si generamos con photoshop un PNG-24 bits con transparencia, veremos que es una imagen donde podemos ver una transparencia total, sin degradados hacia otro color que producen ese efecto de aurea que hace que queden fatal si se posiciona dicha imagen encima de otra imagen o otro color de fondo que no le corresponde.
Los PNG-24 bits tienen este "don", pero como todo "don" conlleva unas consecuencias.
Las consecuencias no son mas que las de siempre en este mundo web, en Firefox funciona todo correctamente, pones el PNG-24 bits lo posiconas y se ve de maravilla. Entonces hacemos lo mismo con Internet Explorer. Colocamos el PNG lo posicionamos, miramos en el navegador que tal ha quedado y.... tachaaaan! Te encuentras un recuadro gris donde tendría que haber una transparencia.
Todos hemos sufrido las inclemencias de necesitar colocar un PNG de 24 bits transparente en una web, en la mayoría de los casos conseguimos montar una estructura de capas e imagenes con las que evitar poner dichos PNG, teniendo que colocar mas imagenes o mas código del necesario.
Desde hace unos días existe un nuevo fichero javascript que ha mejorado sustancialmente la implementación de este sistema PNG fix haciéndolo super fácil de implementar y creo que lo mejor de todo es que soluciona los problemas que había con el atributo filter de Internet Explorer, realmente relentizaba mucho la carga de las páginas en algunas versiones de Internet Explorer (ya que este problema con las transparencias de los PNG-24 solo da problemas con Internet Explorer, con firefox va de maravilla sin tener que hacer absolutamente nada).
Para implementarlo en nuestras páginas solamente tenemos que poner el siguiente código en el HEAD de nuestras páginas:
-
<!--[if lt IE 7]>
-
<mce:script type="text/javascript" src="unitpngfix.js" mce_src="unitpngfix.js"></mce:script>
-
<! [endif]-->
La página de donde poder descargarlo y ver mas detalles: Unit Interactive
