javascript – JQuery背景颜色动画无效

前端之家收集整理的这篇文章主要介绍了javascript – JQuery背景颜色动画无效前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想将“exampleDiv”的背景颜色从原始白色背景更改为当我调用下面的代码立即改变背景黄色,然后退回到原始的白色背景.
$("#exampleDiv").animate({ backgroundColor: "yellow" },"fast");

但是,此代码不起作用.

我只有JQuery核心和JQuery UI链接到我的网页.

为什么上面的代码不工作?

解决方法

我在动画方面取得了不同的成功,但发现使用内置的回调加jQuery的css似乎适用于大多数情况.

尝试这个功能

$(document).ready(function () {

    $.fn.animateHighlight = function (highlightColor,duration) {
        var highlightBg = highlightColor || "#FFFF9C";
        var animateMs = duration || "fast"; // edit is here
        var originalBg = this.css("background-color");

        if (!originalBg || originalBg == highlightBg)
            originalBg = "#FFFFFF"; // default to white

        jQuery(this)
            .css("backgroundColor",highlightBg)
            .animate({ backgroundColor: originalBg },animateMs,null,function () {
                jQuery(this).css("backgroundColor",originalBg); 
            });
    };
});

并称之为:

$('#exampleDiv').animateHighlight();

在IE9,FF4和Chrome中测试,使用jQuery 1.5(不需要UI插件).我也没有使用jQuery颜色插件 – 只需要使用命名颜色(例如“黄色”而不是“#FFFF9C”)即可.

猜你在找的jQuery相关文章