animación stop jQuery prematuramente

Question

Estoy intentando fadeIn y fadeOut un png transparente usando jQuery. Por supuesto, se ve mancha en Firefox, pero significativamente menos que aceptable en el IE (7 y 8). Es un problema conocido con el IE, y por desgracia no parece ser mucho de una solución.

Básicamente lo que estoy haciendo es colocar un rectángulo blanco semitransparente sobre una imagen para que la imagen parezca 'en el fondo'. Quiero hacer esto sin problemas, y ahí es donde entra en juego fadeIn. Debido al fallo de IE, sin embargo, me he visto obligado a fadeIn un rectángulo blanco completamente opaca sobre la imagen, en cambio, por lo que es por desgracia desaparecen. Si bien esto se ve mucho mejor y es casi lo que estoy buscando, todavía no es aceptable. Las necesidades de los usuarios sean capaces de ver alguna imagen en la página, aunque en el fondo.

Así que mi pregunta es la siguiente:

¿Hay una manera de detener la función fadeIn (o cualquier animación jQuery, en realidad) después de la animación para el 75% de su tiempo de animación esperado?

Esto dejaría a mi imagen 75% mezclan el rectángulo blanco, y yo no tendría que tratar con desagradable insecto png transparente de IE.

Gracias!

Answer 1

Se podría utilizar una imagen opaca y simplemente animar la opacidad al 75%.

  $('#overlay').animate({
    opacity: 0.75
  }, 5000, function() {
    // Animation complete.
  });

Answer 2

En lugar de fadeIn / fadeOut, utilice la función animado para animar la propiedad opacidad a su deseada nivel.

Answer 3

También puede utilizar la función fadeTo .

Este es el synthax:

.fadeTo( duration, opacity, [ callback ] )

Answer 4

No recomendado para su situación, pero aquí está la respuesta real a su pregunta, tal como solicitó: -)

.stop( [ clearQueue ], [ jumpToEnd ] )

  

Cuando .Stop () es llamado en un elemento,   la animación actualmente en ejecución (si   los hay) se detiene inmediatamente. Si por   ejemplo, un elemento está siendo ocultada   con .slideUp () cuando .Stop () es   llamada, el elemento de ahora seguirán   visualizada, pero será una fracción de   su altura anterior. Llamar de vuelta   funciones no son llamados.

http://api.jquery.com/stop/