我正在寻找一种理想的jQuery方法,根据背景颜色的亮度来确定正确的文本颜色?
E.g。白色背景,黑色文本颜色。我相信这可以粗略地添加HEX值和猜测,但有没有人知道更好的方法或jQuery方式来做到这一点?
答案 0 :(得分:33)
您可以尝试反转颜色的十六进制值。因此#FFFFFF
变为#000000
而#AAAAAA
变为#555555
。当然,当你有#888888
时,这种方法就会失败,当你倒置时,会给你#777777
(它们的对比度不大)。
此blog post描述了另一种方式(它们仅使用黑色或白色作为前景色,具体取决于背景颜色)。我把它翻译成Javascript:
function idealTextColor(bgColor) {
var nThreshold = 105;
var components = getRGBComponents(bgColor);
var bgDelta = (components.R * 0.299) + (components.G * 0.587) + (components.B * 0.114);
return ((255 - bgDelta) < nThreshold) ? "#000000" : "#ffffff";
}
function getRGBComponents(color) {
var r = color.substring(1, 3);
var g = color.substring(3, 5);
var b = color.substring(5, 7);
return {
R: parseInt(r, 16),
G: parseInt(g, 16),
B: parseInt(b, 16)
};
}