IE中的jQuery淡入淡出效果答案

【问题标题】：jQuery fadeIn, fadeOut effects in IEIE中的jQuery淡入淡出效果
【发布时间】：2012-12-31 15:45:29
【问题描述】：

下面的fadeIn、fadeOut 效果在 Firefox 3.0 中可以正常工作，但在 IE 7 中不起作用……这是什么原因，有什么诀窍？这个想法当然是为了获得“眨眼”效果并将用户的注意力吸引到表格中的特定行。

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);
        }

更新： 发现了愚蠢的问题……“.status-error”指向一个 tr 元素。可以在 Firefox 的 tr 上设置背景颜色并将其淡化，但在 IE 中则不行。将“CSS 指针”更改为“.status-error td”使其指向 tr 下方的 td，并且在所有浏览器中一切正常。

【问题讨论】：

它是如何失败的？当你做一个单一的淡入淡出时它会起作用吗？我在 IE 6 和 7 中使用它没有问题。
@Nathan Long：找到问题了。更新了问题。
始终显示带有 jQuery 问题的相关 HTML。

标签： jquery cross-browser

【解决方案1】：

奇怪.. 无法告诉你为什么会遇到这个问题，但也许可以试试脉动效果插件？ http://docs.jquery.com/UI/Effects/Pulsate

【讨论】：

谢谢。看起来很酷。我正在考虑改用它。然而，它并没有解决我的问题，因为我指向了错误的元素类型（tr 而不是 td）。

【解决方案2】：

我有类似的问题，但由于各种原因我无法选择 td。

如果您也受到影响，您可以尝试使用 show 而不是 fadeIn。由于我使用的是类似损坏的 fadeTo，这对我也没有帮助:(

这里有一个 jQuery 错误 - http://dev.jquery.com/ticket/5451

如果您受到影响，请在票证上发表评论。

【讨论】：

【解决方案3】：

嗯，我已经尝试了各种方法来解决这个问题。我使用的down and dirty 方法是检测文本上的背景色和前景色，并通过颜色变化为div/span/etc 设置动画。

这个 sn-p 将“脉动”文本一次（你可以创建一个函数来做更多次：

$.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,
       ...
      )}
    );
}

【讨论】：