发现一个BUG float转换那个写错了,原义是把不足2位的前面补0,结果逻辑搞错了 应该是 if(regs[1].test(str)){ var temp = regs[1].exec(str); var r = Math.round(parseFloat(temp[1]) * 255); var g = Math.round(parseFloat(temp[3]) * 255); var b = Math.round(parseFloat(temp[5]) * 255); r = r.toString(16); g = g.toString(16); b = b.toString(16); r = r.length == 1 ? ("0" + r) : r; g = g.length == 1 ? ("0" + g) : g; b = b.length == 1 ? ("0" + b) : b; return "#" + r + g + b; }
去w3c看了 The RGB color model is being used in numerical color specifications. These examples all specify the same color: EM { color: #f00 } /* #rgb */ EM { color: #ff0000 } /* #rrggbb */ EM { color: rgb(255,0,0) } /* integer range 0 - 255 */ EM { color: rgb(100%, 0%, 0%) } /* float range 0.0% - 100.0% */看来EM { color: rgb 1.0 0.0 0.0 } 是被第四个方式代替了
这个不是问题
我的意思是我想像ff那样无论设置color时用的是哪一个方法(那4个之一)
都能获取一个实际的rgb值
为这个方式写一个
那可痛苦了这个多颜色
看来也没什么好方法了
单词和RGB值对应那个是在网上找的<script>
function toRRGGBB(str){
var regs = new Array();
regs.push(/^#[0-9a-f]{6}$/i);// #RRGGBB
regs.push(/^rgb\s+(\d+(\.\d+)?)\s+(\d+(\.\d+)?)\s+(\d+(\.\d+)?)$/i);// float range: 0.0 - 1.0
regs.push(/^[a-zA-Z]+$/i);// 单词
regs.push(/^#[0-9a-f]{3}$/i);// #RGB var mapping = {"aliceblue":"#F0F8FF", "antiquewhite":"#FAEBD7", "aqua":"#00FFFF", "aquamarine":"#7FFFD4", "azure":"#F0FFFF", "beige":"#F5F5DC", "bisque":"#FFE4C4", "black":"#000000", "blanchedalmond":"#FFEBCD", "blue":"#0000FF", "blueviolet":"#8A2BE2", "brown":"#A52A2A", "burlywood":"#DEB887", "CADetblue":"#5F9EA0", "chartreuse":"#7FFFA0", "chocolate":"#D2691E", "coral":"#FF7F50", "cornflowerblue":"#6495ED", "cornsilk":"#FFF8DC", "crimson":"#DC143C", "cyan":"#00FFFF", "darkblue":"#00008B", "darkcyan":"#008B8B", "darkgoldenrod":"#B8860B", "darkgray":"#A9A9A9", "darkgreen":"#006400", "darkkhaki":"#BDB76B", "darkmagenta":"#8B008B", "darkolivegreen":"#556B2F", "darkorange":"#FF8C00", "darkorchid":"#9932CC", "darkred":"#8B0000", "darksalmon":"#E9967A", "darkseagreen":"#8FBC8F", "darkslateblue":"#483D8B", "darkslategray":"#2F4F4F", "darkturquoise":"#00CED1", "darkviolet":"#9400D3", "deeppink":"#FF1493", "deepskyblue":"#00BFFF", "dimgray":"#696969", "dodgerblue":"#1E90FF", "firebrick":"#B22222",
"floralwhite":"#FFFAF0", "forestgreen":"#228B22", "fushcia":"#FF00FF", "gainsboro":"#DCDCDC", "Ghostwhite":"#F8F8FF", "gold":"#FFD700", "goldenrod":"#DAA520", "gray":"#808080", "green":"#008000", "greenyellow":"#ADFF2F", "honeydew":"#F0FFF0", "hotpink":"#FF69B4", "indianred":"#CD5C5C", "indigo":"#4B0082", "ivory":"#FFFFF0", "khaki":"#F0E68C", "lavender":"#E6E6FA", "lavenderblush":"#FFF0F5", "lawngreen":"#7CFC00", "lemonchiffon":"#FFFACD", "lightblue":"#ADD8E6", "lightcoral":"#F08080", "lightcyan":"#E0FFFF", "lightgoldenrodyellow":"#FAFAD2", "lightgreen":"#90EE90", "lightgrey":"#D3D3D3", "lightpink":"#FFB6C1", "lightsalmon":"#FFA07A", "lightseagreen":"#20B2AA", "lightskyblue":"#87CEFA", "lightslategray":"#778899", "lightsteelblue":"#B0C4DE", "lightyellow":"#FFFFE0", "lime":"#00FF00", "limegreen":"#32CD32", "linen":"#FAF0E6", "magenta":"#FF00FF", "maroon":"#800000", "mediumaquamarine":"#66CDAA", "mediumblue":"#0000CD", "mediumorchid":"#BA55D3", "mediumpurple":"#9370DB", "mediumseagreen":"#3CB371",
"mediumslateblue":"#7B68EE", "mediumspringgreen":"#00FA9A", "mediumturquoise":"#48D1CC", "mediumvioletred":"#C71585", "midnightblue":"#191970", "mintcream":"#F5FFFA", "mistyrose":"#FFE4E1", "moccasin":"#FFE4B5", "navajowhite":"#FFDEAD", "navy":"#000080", "oldlace":"#FDF5E6", "olive":"#808000", "olivedrab":"#6B8E23", "orange":"#FFA500", "orangered":"#FF4500", "orchid":"#DA70D6", "palegoldenrod":"#EEE8AA", "palegreen":"#98FB98", "paleturquoise":"#AFEEEE", "palevioletred":"#DB7093", "papayawhip":"#FFEFD5", "peachpuff":"#FFDAB9", "peru":"#CD853F", "pink":"#FFC0CB", "plum":"#DDA0DD", "powderblue":"#B0E0E6", "purple":"#800080", "red":"#FF0000", "rosybrown":"#BC8F8F", "royalblue":"#4169E1", "saddlebrown":"#8B4513", "salmon":"#FA8072", "sandybrown":"#F4A460", "seagreen":"#2E8B57", "seashell":"#FFF5EE", "sIEnna":"#A0522D", "silver":"#C0C0C0", "skyblue":"#87CEEB", "slateblue":"#6A5ACD", "slategray":"#708090", "snow":"#FFFAFA", "springgreen":"#00FF7F", "steelblue":"#4682B4", "tan":"#D2B48C", "teal":"#008080",
"thistle":"#D8BFD8", "tomato":"#FF6347", "turquoise":"#40E0D0", "violet":"#EE82EE", "wheat":"#F5DEB3", "white":"#FFFFFF", "whitesmoke":"#F5F5F5", "yellow":"#FFFF00", "yellowgreen":"#9ACD32"}; if(regs[0].test(str)){
return str;
}
if(regs[1].test(str)){
var temp = regs[1].exec(str);
var r = Math.round(parseFloat(temp[1]) * 255);
var g = Math.round(parseFloat(temp[3]) * 255);
var b = Math.round(parseFloat(temp[5]) * 255);
r = ("" + r).length == 1 ? ("0" + r) : r;
g = ("" + g).length == 1 ? ("0" + g) : g;
b = ("" + b).length == 1 ? ("0" + b) : b;
return "#" + r.toString(16) + g.toString(16) + b.toString(16);
}
if(regs[2].test(str)){
return eval("mapping." + str);
}
if(regs[3].test(str)){
return str.replace(/([0-9a-f])/gi,"$1$1");
}
return "";
}alert(toRRGGBB("#ff0000"));
alert(toRRGGBB("rgb 0.9 1.0 0.5"));
alert(toRRGGBB("yellowgreen"));
alert(toRRGGBB("#f0f"));
</script>
float转换那个写错了,原义是把不足2位的前面补0,结果逻辑搞错了
应该是 if(regs[1].test(str)){
var temp = regs[1].exec(str);
var r = Math.round(parseFloat(temp[1]) * 255);
var g = Math.round(parseFloat(temp[3]) * 255);
var b = Math.round(parseFloat(temp[5]) * 255);
r = r.toString(16);
g = g.toString(16);
b = b.toString(16);
r = r.length == 1 ? ("0" + r) : r;
g = g.length == 1 ? ("0" + g) : g;
b = b.length == 1 ? ("0" + b) : b;
return "#" + r + g + b;
}
这个我试了一下
发现没有效果
不知是不是已经没用了
用这个color: rgb(255,0,0)倒可以
看来已经换成后面那个方式了
The RGB color model is being used in numerical color specifications. These examples all specify the same color: EM { color: #f00 } /* #rgb */
EM { color: #ff0000 } /* #rrggbb */
EM { color: rgb(255,0,0) } /* integer range 0 - 255 */
EM { color: rgb(100%, 0%, 0%) } /* float range 0.0% - 100.0% */看来EM { color: rgb 1.0 0.0 0.0 }
是被第四个方式代替了