PDA

Ver la Versión Completa : png en IE me esta volviendo loca!


maria lange
28/01/08, 20:55:57
bueno eso! estoy armando una web y ya probe casi todos los JS que encontre para que los png se vean transparentes en IE.
encontre uno que soluciono el problema, pero añadio otro: dejo de andar el rollover...
alguien tiene algun JS que ande en serio??? se agradece mucho :D


pd: es insoportable tener que lidiar con esto todo el tiempo! :X

PowerMacX
28/01/08, 21:12:23
http://webfx.eae.net/dhtml/pngbehavior/pngbehavior.html

Wheeljack
28/01/08, 21:13:11
Mañana en la oficina te mando el que uso yo, que hasta funciona con PNG c/transparencia en fondos (background-image)
Y si, IE6 es un bodrio...

dfgonzalez
28/01/08, 22:08:07
No pude probar aún esto pero si hace lo que dice es una masita-cabayito :)

http://code.google.com/p/ie7-js/

bogardus
28/01/08, 22:15:02
Yo tb quiero lo que tengas wheeljack asi que si lo podes postear seria buenisimo...

Saludos y gracias

bogardus
28/01/08, 22:29:32
dfgonzalez: Ese lo probe en otro sitio pero no vi muchos cambios. Igual creo que maria lo hizo y renombro los png para que funcione.
Ese fue (creo) el js que le trajo inconvenientes, dado que ahora no funcionan los rollovers.

maria lange
28/01/08, 22:52:28
sip, como dijo bogardus el JS que paso dfgonzalez fue el que armo lio con los rollover (aunque soluciono lo de las transparencias ;) )
voy a probar el que paso PowerMacx! wheeljack cuando puedas pasa el tuyo!
gracias

alfonso
29/01/08, 11:29:37
Yo uso este: http://homepage.ntlworld.com/bobosola/index.htm

pero no funciona con transparencia PNG como background
el de wheeljack debe ser mas avanzado

Wheeljack
31/01/08, 18:01:45
Usen este. Copien y peguen y guardenlo como "iepngfix.htc"

<public:component>
<public:attach event="onpropertychange" onevent="doFix()" />

<script type="text/javascript">

// Path a una imagen en blanco. Generalmente es un gif de 4x4 transparente,
if (typeof blankImg == 'undefined') var blankImg = '/_assets/images/dummy.gif';


var f = 'DXImageTransform.Microsoft.AlphaImageLoader';

function filt(s, m)
{
if (filters[f])
{
filters[f].enabled = s ? true : false;
if (s) with (filters[f]) { src = s; sizingMethod = m }
}
else if (s) style.filter = 'progid:'+f+'(src="'+s+'",sizingMethod="'+m+'")';
}

function doFix()
{
// Si es IE7 esta todo OK.
if (!/MSIE (5\.5|6\.)/.test(navigator.userAgent) ||
(event && !/(background|src)/.test(event.propertyName))) return;

var bgImg = currentStyle.backgroundImage || style.backgroundImage;

if (tagName == 'IMG')
{
if ((/\.png$/i).test(src))
{
if (currentStyle.width == 'auto' && currentStyle.height == 'auto')
style.width = offsetWidth + 'px';
filt(src, 'scale');
src = blankImg;
}
else if (src.indexOf(blankImg) < 0) filt();
}
else if (bgImg && bgImg != 'none')
{
if (bgImg.match(/^url[("']+(.*\.png)[)"']+$/i))
{
var s = RegExp.$1;
if (currentStyle.width == 'auto' && currentStyle.height == 'auto')
style.width = offsetWidth + 'px';
style.backgroundImage = 'none';
filt(s, 'crop');
// IE link fix.
for (var n = 0; n < childNodes.length; n++)
if (childNodes[n].style) childNodes[n].style.position = 'relative';
}
else filt();
}
}

doFix();

</script>
</public:component>
Y luego en su CSS:

img, div, ul, li {
behavior: url(/_assets/css/iepngfix.htc);
}

PowerMacX
31/01/08, 18:06:31
También hay que subir un gif tranparente en algun lugar del server y reemplazar la dirección en el behavior, donde dice
blankImg = '/_assets/images/dummy.gif'

Wheeljack
31/01/08, 18:08:32
También hay que subir un gif tranparente en algun lugar del server y reemplazar la dirección en el behavior, donde dice
blankImg = '/_assets/images/dummy.gif'

Bueno, si... era obvio. Ese el path que uso yo generalmente, por eso lo deje.

PowerMacX
31/01/08, 18:12:42
Si, pero como en el tutorial que puse arriba lo aclaraban, me pareció que era útil ponerlo acá también.

bogardus
31/01/08, 22:43:03
Muchas gracias gente....estoy probando y en cuanto tenga un IE cerca para testear les cuento como me fue. Ahora una cosa:

Wheeljack: En el codigo que pusiste arriba decis que tenemos que guardar el archivo como "pngbehavior.htc" y en el CSS lo estas llamando con el nombre de "iepngfix.htc".

Voy a ver si me funca y les comento.

Wheeljack
31/01/08, 23:02:28
Muchas gracias gente....estoy probando y en cuanto tenga un IE cerca para testear les cuento como me fue. Ahora una cosa:

Wheeljack: En el codigo que pusiste arriba decis que tenemos que guardar el archivo como "pngbehavior.htc" y en el CSS lo estas llamando con el nombre de "iepngfix.htc".

Voy a ver si me funca y les comento.
Si perdon, guardenlo con el nombre que quieran y linkeenlo bien. Mi error!