jQuery Animate（）和BackgroundColor

Question

我试图通过使用JQuery更改背景颜色来创建简单的脉冲效果。但是，我无法将backgroundColor设置为动画。

function show_user(dnid) {
    /* dnid is HTML ID of a div. */
    if (! $(dnid).is(':visible')) {
        $(dnid).show()
    }
    $('html, body').animate({scrollTop: $(dnid).offset().top});
    $(dnid).animate({backgroundColor: "#db1a35"}, 1200);
}

奇怪的是，该备用动画有效：

$(dnid).animate({opacity: "toggle"}, 1200);

但这不是我想要的。

另外，函数中的show（）和scroll功能可以正常工作。只是背景颜色动画没有。

上面的函数通过此链接调用 <a href="#" onclick="javascript:show_user('#9e4cde88b90004ea722e9e129ed83747')">Locate Me</a>

有人可以帮我设置背景颜色的动画吗？

=========

谢谢大家的帮助。很多类似的答案。这就是我最后得到的

在我的标题中

<script src="http://code.jquery.com/color/jquery.color-2.1.2.min.js"></script>

然后在滚动动画之后的我的show_user函数中。

var bgcol = $(dnid).css('backgroundColor');
$(dnid).animate({backgroundColor: "#db1a35"}, 2000);
$(dnid).animate({backgroundColor: bgcol}, 2000);

这给出了一个相对较快的红色“脉冲”，将吸引用户的眼睛。

再一次感谢你的帮助。

Answer 1

jQuery默认无法设置颜色动画。为了动画化颜色，请使用官方的jQuery.Color插件。

除非另有说明，否则所有动画属性都应设置为单个数值。大多数非数字属性不能使用基本的jQuery功能进行动画处理（例如，可以对width，height或left进行动画处理，而不能对background-color进行动画处理，除非使用jQuery.Color（）插件）。