javascript - 根据数值自动设置背景颜色

Question

上下文

我正在寻找一种根据数值自动制作背景颜色的方法。

在我的示例中，颜色根据百分比从绿色变为红色:

问题

我只需要 css 或者我还需要 javascript ?

例子

您可以使用此标记:http://jsfiddle.net/3J3Yb/1/ .

Answer 1

从 Joseph 的解决方案出发:

红色是 (255,0,0)；黄色是 (255,255,0)；绿色是 (0,255,0)。所以如果你想让你的渐变通过黄色，你需要逐渐将绿色增加到 100%，然后将红色减少到 0。

http://jsfiddle.net/mblase75/Xw3JL/1

$(".percentVals td").each(function(){
    var r = Math.min(100,parseInt(this.innerHTML,10)*2);
    var g = Math.min(100,200-parseInt(this.innerHTML,10)*2);
    this.style.backgroundColor = "rgb(" + r + "%," + g + "%,0%)"
});