我的 HTML 标签上有一张图片作为背景，背景颜色为 rgba(0,0,0,0.7);在我的身体标签上。我正在构建一个小脚本，允许我动态更改背景图像，为此我想将身体设置为 rgba(0,0,0,1)，更改图像，然后设置动画回到 0.7 的不透明度。
我用谷歌搜索了一个名为 jQuery Color 的 jQuery 插件，但该插件似乎在最新版本的 jQuery 中被破坏了“b.end is undefined”。其他问过类似问题的人也用 cmets 回答说这个解决方案不再有效。
我有点不知所措，所有谷歌搜索都指向同一个插件，还有其他人知道解决方案吗？
目前这是我正在尝试的：
jQuery('body').animate({
'backgroundColor':'rgba(0, 0, 0, 1)'
});
感谢您的帮助:)
【问题讨论】：
jQuery UI 可以开箱即用（所以您只需要 jQuery 和 jQuery UI）。
你几乎拥有它。在您的 jQuery 脚本调用 (<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>) 之后在 head 中添加 jQuery UI 脚本调用，然后试试这个：
jQuery('body').animate({
backgroundColor: 'rgba(0, 0, 0, 1)'
});
backgroundColor 是 jQuery 属性名，不需要加引号。只有具有不同的相应 jQuery 属性名称的 CSS 属性才需要引号，这将是 background-color（backgroundColor 代表的 CSS 属性）。所以这也可以：
jQuery('body').animate({
'background-color': 'rgba(0, 0, 0, 1)'
});
这也可以通过纯 CSS3 动画非常简单地完成。
【讨论】：
这段代码我还没写完，但这是纯jQuery的基础。这对你来说是一个想法的开始。试试这样的：
$('.background').click(function(){
var changeColor;
var speed = 100;
var i = speed;
changeColor = setInterval(function(){
i--;
var opacity = i / speed;
$('.background').css({backgroundColor: "rgba(0,0,0, " + opacity + ")"});
}, 1);
setTimeout(function(speed){
clearInterval(changeColor);
}, speed * 5);
});
基本原则是每 1 毫秒更改一个数字，然后控制一个百分比，作为背景颜色的变量。这效率不高，但正是您正在寻找的想法。
更新在这里检查小提琴：http://jsfiddle.net/mV4st/3/
【讨论】：