0

我在网上找到了这段代码，但它没有做我想要的。

function ColorLuminance(hex, lum) {
    // validate hex string
    hex = String(hex).replace(/[^0-9a-f]/gi, '');
    if (hex.length < 6) {
        hex = hex[0]+hex[0]+hex[1]+hex[1]+hex[2]+hex[2];
    }
    lum = lum || 0;
    // convert to decimal and change luminosity
    var rgb = "#", c, i;
    for (i = 0; i < 3; i++) {
        c = parseInt(hex.substr(i*2,2), 16);
        c = Math.round(Math.min(Math.max(0, c + (c * lum)), 255)).toString(16);
        rgb += ("00"+c).substr(c.length);
    }
    return rgb;
}

所以我继续使用 jQuery 来更改周围框的背景颜色（显示在投票结果（右侧）背景颜色中）。

$(".bar-container").each(function() {
    var hexColor = $(this).children(":first").css("background-color");
    var bgColor = ColorLuminance(hexColor, .2);
    $(this).css({"background-color": bgColor});
});

这在文档准备好时使用。

我想要做的是获取实际的投票颜色（从左边是百分比）并使整个容器颜色更浅一些（但基本颜色相同）。因此，如果百分比条为红色，则不应使包含条的整体背景变为紫色。它应该使它成为较浅的红色。

该ColorLuminance功能不起作用，因为它正在完全改变颜色！

如何修改此功能以获得较浅的颜色？（最好基于百分比，这是lum参数的用途）

4

1 回答 1

0

要更改 RGB 颜色的亮度，我会将其转换为 HSV 颜色空间，您会得到 Hue（颜色）、Saturation 和 Value（Brightness）。所以你只能改变亮度。

然后你再次将颜色从 HSV 颜色空间带回 RGB 颜色空间。

您可以在此处找到 HSV javascript 逆变器：http ://www.javascripter.net/faq/rgb2hsv.htm 可以在此处找到有关 HSV 的更多信息：https ://en.wikipedia.org/wiki/HSL_and_HSV

也看看我可以强制 jQuery.css("backgroundColor") 以十六进制格式返回吗？, 颜色总是以 RGB 的形式返回。

于 2013-05-17T05:42:51.540 回答