IE6 y pngs

[Snd234]

IE6 no tiene soporte para transparencia en imagenes PNG. Solucion? aplicar algunos hack.

Si la imagen es un fondo asignado en la CSS, tendras que poner el siguiente codigo en la clase o id correspondiente

Código:

.nombre_clase {
background-image: url(”imagen.png”) !important;
background-image: none;
filter: none !important;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=’direccion_absoluta/imagen.png’);
}

Fijate que la ultima direccion, tiene que ser absoluta, osea la direccion completa de donde se encuentra la imagen

Por el contrario, si la imagen esta "puesta" en la pagina, tendrias que importar el siguiente codigo JS

Código:

function correctPNG() // correctly handle PNG transparency in Win IE 5.5 & 6.
{
   var arVersion = navigator.appVersion.split("MSIE")
   var version = parseFloat(arVersion[1])
   if ((version >= 5.5) && (document.body.filters)) 
   {
      for(var i=0; i<document.images.length; i++)
      {
         var img = document.images[i]
         var imgName = img.src.toUpperCase()
         if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
         {
            var imgID = (img.id) ? "id='" + img.id + "' " : ""
            var imgClass = (img.className) ? "class='" + img.className + "' " : ""
            var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
            var imgStyle = "display:inline-block;" + img.style.cssText 
            if (img.align == "left") imgStyle = "float:left;" + imgStyle
            if (img.align == "right") imgStyle = "float:right;" + imgStyle
            if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle
            var strNewHTML = "<span " + imgID + imgClass + imgTitle
            + " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
            + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
            + "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>" 
            img.outerHTML = strNewHTML
            i = i-1
         }
      }
   }    
}

window.attachEvent("onload", correctPNG);

Una vez que se carge toda la pagina, este codigo buscara todas las imagenes y mostrara las transperencias segun corresponda.