Foros del Web » Programando para Internet » Jquery »

jquery: efecto fade en internet explorer

Estas en el tema de jquery: efecto fade en internet explorer en el foro de Jquery en Foros del Web. 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 ...
  #1 (permalink)  
Antiguo 05/03/2011, 13:41
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 14 años, 9 meses
Puntos: 269
jquery: efecto fade en internet explorer

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.
  #2 (permalink)  
Antiguo 07/03/2011, 17:18
Avatar de chichote
Colaborador
 
Fecha de Ingreso: diciembre-2004
Ubicación: Santiago - Chile
Mensajes: 1.868
Antigüedad: 19 años, 3 meses
Puntos: 145
Respuesta: jquery: efecto fade en internet explorer

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
__________________
http://chicho.ninja yiaaaa
  #3 (permalink)  
Antiguo 07/03/2011, 18:59
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 14 años, 9 meses
Puntos: 269
Respuesta: jquery: efecto fade en internet explorer

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

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

Aclarar que persiste el defecto aún cambiando esto:
Código HTML:
Ver original
  1. <img id="bg_body_index" src="imagenes/bg_body.png" alt="" width="640" height="482"/>
por esto:
Código HTML:
Ver original
  1. <div id="bg_body_index"></div>
Código CSS:
Ver original
  1. #bg_body_index{
  2. position:absolute; top:0; left:0;
  3. width:640px;
  4. height:482px;
  5. background:url('imagenes/bg_body.png') no-repeat 0 0;
  6. }
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

Última edición por cristian_cena; 07/03/2011 a las 19:07
  #4 (permalink)  
Antiguo 07/03/2011, 21:13
Avatar de chichote
Colaborador
 
Fecha de Ingreso: diciembre-2004
Ubicación: Santiago - Chile
Mensajes: 1.868
Antigüedad: 19 años, 3 meses
Puntos: 145
Respuesta: jquery: efecto fade en internet explorer

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.
__________________
http://chicho.ninja yiaaaa
  #5 (permalink)  
Antiguo 07/03/2011, 21:45
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 14 años, 9 meses
Puntos: 269
Respuesta: jquery: efecto fade en internet explorer

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.
  #6 (permalink)  
Antiguo 07/03/2011, 22:13
Avatar de masterpuppet
Software Craftsman
 
Fecha de Ingreso: enero-2008
Ubicación: Montevideo, Uruguay
Mensajes: 3.550
Antigüedad: 16 años, 2 meses
Puntos: 845
Respuesta: jquery: efecto fade en internet explorer

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.
__________________
http://es.phptherightway.com/
thats us riders :)
  #7 (permalink)  
Antiguo 08/03/2011, 05:35
Avatar de chichote
Colaborador
 
Fecha de Ingreso: diciembre-2004
Ubicación: Santiago - Chile
Mensajes: 1.868
Antigüedad: 19 años, 3 meses
Puntos: 145
Respuesta: jquery: efecto fade en internet explorer

Cita:
Iniciado por cristian_cena Ver Mensaje
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.
__________________
http://chicho.ninja yiaaaa
  #8 (permalink)  
Antiguo 08/03/2011, 15:57
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 14 años, 9 meses
Puntos: 269
Respuesta: jquery: efecto fade en internet explorer

Hola masterpuppet. muchas gracias por la info, la pondré en práctica y luego les cuento. Saludos.
  #9 (permalink)  
Antiguo 26/06/2011, 17:11
 
Fecha de Ingreso: marzo-2010
Mensajes: 5
Antigüedad: 14 años
Puntos: 0
Respuesta: jquery: efecto fade en internet explorer

Cita:
Iniciado por masterpuppet Ver Mensaje
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

Etiquetas: efecto, explorer, fade, internet
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 19:49.