efectos - jquery animate opacity

jQuery fadeIn, fadeOut efectos en IE

Question

El siguiente efecto fadeIn , fadeOut funciona bien en Firefox 3.0 pero no funciona en IE 7 ... ¿Qué es eso y cuál es el truco? La idea es, por supuesto, obtener un efecto de "parpadeo" y atraer la atención del usuario hacia una fila específica en una tabla.

function highLightErrorsAndWarnings() {
            $(".status-error").fadeIn(100).fadeOut(300).fadeIn(300).fadeOut(300).fadeIn(300).fadeOut(300).fadeIn(300);
            $(".status-warning").fadeIn(100).fadeOut(300).fadeIn(300).fadeOut(300).fadeIn(300).fadeOut(300).fadeIn(300);
        }

Actualización: Encontrado el estúpido problema ... ".status-error" apunta a un tr-element. Es posible establecer el color de fondo y fundirlo en un tr en Firefox pero no en IE. Al cambiar el "puntero CSS" por ".status-error td ", se apuntó a la td debajo del tr y todo funcionó en todos los navegadores.

Answer 1

Extraño ... no podría decirte por qué estás teniendo ese problema, pero tal vez intentes con el plugin de efecto de pulsación. http://docs.jquery.com/UI/Effects/Pulsate

Answer 2

Tengo un problema similar, pero no puedo seleccionar el td en su lugar por varias razones.

Si también se ve afectado, puede intentar usar show en lugar de fadeIn. Como estoy usando el fade similarmente roto, esto tampoco me sirve :(

Hay un error jQuery abierto aquí - http://dev.jquery.com/ticket/5451

Si está afectado, por favor coméntelo en el boleto.

Answer 3

Bueno, he experimentado con varias formas de abordar este problema. El enfoque down and dirty que uso es detectar el color de fondo y de primer plano en el texto y simplemente animar el div/span/etc con cambio de color.

Este fragmento "pulsará" el texto una vez (puede crear una función que lo haga más veces de la siguiente manera:

$.fn.crossBrowserPulsate = function() {
    var startColor = $(this).css("background-color");
    var endColor = $(this).css("color");

    $(this).animate({color:startColor},500,
     function() {
      $(this).animate({color:endColor},500,
       ...
      )}
    );
}