jQuery 函数将 alpha 添加到元素 bg

Question

我正在尝试创建一个函数来检查元素的背景并将其背景更改为具有给定的 alpha channel 。函数具有以下形式:

$.fn.bgalpha = function(alpha) {
    var bg = $(this).css('background-color');
    //...
}

但是:当设置了正常颜色时，chrome 将 bg 返回为 rgb；当没有 bg 时，chrome 将 bg 返回为零的 rgba，即 8 始终返回十六进制，当没有 bg 时，ie9 返回“透明”；当有 bg 时，ie9 返回“透明”等。这么多不同的情况。

我想要做的是>从对象的bg颜色中获取r，g，b，添加到它'a' channel 并将元素bg设置为rgba与所有值。但当我们谈论跨浏览时，从简单的事情到事情变得棘手和复杂。

您知道如何以“通用”方式操作这些颜色吗？在不同的情况下，我得到值“none”、“transparent”、“rgba”、“rgb”或“hex”作为 bg 的初始值

Answer 1

包括 jQuery Color plugin (它是官方认可的)并使用它的 .alpha() 方法。

以下代码片段将更改 this 的背景颜色，使其达到 50% 透明:

var clr2 = $.Color(this,'background-color').alpha(0.5);
$(this).css('background-color', clr2.toRgbaString());

或作为一行:

$(this).css('background-color', $.Color(this,'background-color').alpha(0.5).toRgbaString());

http://jsfiddle.net/mblase75/aea3h/