jquery: efecto fade en internet explorer

[cristian_cena]

Hola compañeros. Resulta que estoy usando los efectos fadeIn(); y fadeOut() de jquery para hacer el hover de unos botones.
Comentarles que se visualizan perfecto en todos los navegadores menos en internet explorer v.6, v.7 y v.8

Se ve desagradable cuando se produce el fade, quedando negro el fondo de la capa que contiene el background-image.

¿No funciona este efecto para ie?
¿Tienen problemas los png+fade en ie8?
¿existe algún truco para solucionarlo?

Desde ya muchas gracias por su respuesta. Un fuerte abrazo.

[chichote]

Hola cristian_cena

Puedes postear tu codigo?, la verdad es que a mi me resulta bien en IE8. 7 incluso en el 6.


Prueba tambien en otros computadores, quizas sea problema puntual de tu pc, con microsoft nunca se sabe.

saludos

[cristian_cena]

Hola cherivera, gracias por responder, ahi va el código.

Código HTML:

<!--tengo una imagen-->
<img id="bg_body_index" src="imagenes/bg_body.png" alt="" width="640" height="482"/>
<!--e inmediatamente abajo de ella (en el body) escribo lo siguiente:-->
<script type="text/javascript">$("#bg_body_index").fadeIn(2000);</script>
 

Aclarar que persiste el defecto aún cambiando esto:

Código HTML:

<img id="bg_body_index" src="imagenes/bg_body.png" alt="" width="640" height="482"/>
 

por esto:

Código HTML:

<div id="bg_body_index"></div>
 

Código CSS:

#bg_body_index{
position:absolute; top:0; left:0;
width:640px;
height:482px;
background:url('imagenes/bg_body.png') no-repeat 0 0;
}
 

O sea, capa con background o etiqueta de imagen anda mal igual.

Saludos.

edito:
aquí puedes ver una captura de como se ve el color negro de fondo cuando hacemos fade in y out en un hover alternando dos imagenes png fondo transparente


aquí las imagenes reales:
imagen

imagen en hover

[chichote]

La verdad que no entendi lo que quieres hacer? que cuando se cargue la pagina la imagen aparesca? para que es la imagen hover? al pasar el mouse hara el mismo efecto?

Hace un tiempo tuve un problema con un efecto en jquery y con png en IE, no recuerdo que efecto, pero el problema no era el efecto sino que IE no renderiza de = manera los png sobre todo cuando tienen transparencias, hay varios plugins para el tratamiento de png para IE, en este momento no recuerdo sus nombres, pero busca en google, de seguro encuentras facilmente. mañana si tengo un tiempito de doy una mano con eso, ya es tarde :D

saludos.

[cristian_cena]

hola cherivera, gracias por responder

Por un lado hago cargar una imagen cuando carga la pagina y por otro hago hover en los botones. Pero en si no importa que es lo que este haciendo porque el efecto es el que no anda bien en ie.
O sea, el código anda perfecto. pero no se renderiza bien el png en ie cuando se produce el fadeIn/fadeOut. Por lo tanto, las capturas que paso son para ilustrar el problema nada mas que eso.

Sobre el tratamiento de png para ie, conozco librerias pero para ie6, lo que me llama la atencion es que en ie8 se esta viendo horrible también.

La pregunta en todo caso sería:
¿los efectos fadeIn/fadeOut de jquery cuando son usados en capas cuyos fondos son png transparentes no funcionan correctamente en ie?

Ahora, si tu puedes ver bien los efectos fade con png transparente en ie8 entonces o yo estoy loco o esta computadora me esta tomando el pelo.

Hasta la próxima.

[masterpuppet]

Que tal cristian_cena,

te dejo un link que habla sobre el tema, antes de aplicar los filtros, intenta lo siguiente, envolve a la capa que le haces fade en un wrapper, a este wrapper hacele el fade, y seteale por css zoom:1 para que fuerce el hasLayout.

Saludos.

[chichote]

Iniciado por cristian_cena

Ahora, si tu puedes ver bien los efectos fade con png transparente en ie8 entonces o yo estoy loco o esta computadora me esta tomando el pelo.

Hasta la próxima.

mmmm loco no creo, me ha pasado en varias ocaciones que una version de IE varia de un pc a otro, de hecho dentro de una version de IE7 por ejemplo hay varias subversiones por llamarlo asi y en ocaciones se compartan de manera diferente aunque ambas sean 7, por eso te decia q pruebes en otra maquina, o bien si puedes subir la web a internet seria ideal asi mas gente podemos hacerle un pequeño test y decirte como se ve.

saludos.

[cristian_cena]

Hola masterpuppet. muchas gracias por la info, la pondré en práctica y luego les cuento. Saludos.

[necromcraft]

Iniciado por masterpuppet

Que tal cristian_cena,

te dejo un [URL="http://stackoverflow.com/questions/1204457/how-to-solve-hack-fading-semi-transparent-png-bug-in-ie8"]link[/URL] que habla sobre el tema, antes de aplicar los filtros, intenta lo siguiente, envolve a la capa que le haces fade en un wrapper, a este wrapper hacele el fade, y seteale por css zoom:1 para que fuerce el hasLayout.

Saludos.

hola master, tienes algun ejemplo ya que he echo una pagina muy buena donde cuadros con sombra aparecen sobre una imagen y en todos los navegadores se ve bien excepto iexplorer las sombra se ve como un horrible contorno negro, saludos

ayuda