反转特定元素的文本颜色(使用jQuery)
答
首先负载http://www.phpied.com/files/rgbcolor/rgbcolor.js
然后,你可以做
$.fn.invertElement = function() {
var prop = 'color';
if (!this.css(prop)) return;
var color = new RGBColor(this.css(prop));
if (color.ok) {
this.css(prop, 'rgb(' + (255 - color.r) + ',' + (255 - color.g) + ',' + (255 - color.b) + ')');
}
};
$('div').invertElement();
当用字(如“黑”)中指定的颜色属性这也应该工作,而不是一个RGB值。但是,透明度不好。
答
有点晚,但迟到总比不到好:
function invert(rgb) {
rgb = Array.prototype.join.call(arguments).match(/(-?[0-9\.]+)/g);
for (var i = 0; i < rgb.length; i++) {
rgb[i] = (i === 3 ? 1 : 255) - rgb[i];
}
return rgb;
}
console.log(
invert('rgba(255, 0, 0, 0.3)'), // 0, 255, 255, 0.7
invert('rgb(255, 0, 0)'), // 0, 255, 255
invert('255, 0, 0'), // 0, 255, 255
invert(255, 0, 0) // 0, 255, 255
);
+0
谢谢!简单而有用! 将是真棒有一个函数,反转十六进制和rgb没有metter作为参数传递 – 2013-11-12 19:38:33
答
我发现了一个巨大的 '十六进制颜色变频' 功能中写道马特LaGrandeur(http://www.mattlag.com/)
function invertHex(hexnum){
if(hexnum.length != 6) {
console.error("Hex color must be six hex numbers in length.");
return false;
}
hexnum = hexnum.toUpperCase();
var splitnum = hexnum.split("");
var resultnum = "";
var simplenum = "FEDCBA9876".split("");
var complexnum = new Array();
complexnum.A = "5";
complexnum.B = "4";
complexnum.C = "3";
complexnum.D = "2";
complexnum.E = "1";
complexnum.F = "0";
for(i=0; i<6; i++){
if(!isNaN(splitnum[i])) {
resultnum += simplenum[splitnum[i]];
} else if(complexnum[splitnum[i]]){
resultnum += complexnum[splitnum[i]];
} else {
console.error("Hex colors must only include hex numbers 0-9, and A-F");
return false;
}
}
return resultnum;
}
来源是在这里: http://www.mattlag.com/scripting/hexcolorinverter.php
简而言之,获取颜色,将其转化为3个十进制值(它以十六进制IIRC形式返回)并从255中减去这些值。然后,您有你的R,G和B频道,你使用'。.css()'来再次应用它们。 – Bojangles 2012-02-01 18:33:17
http://webhole.net/2010/01/06/how-to-invert-an-elements-color/ – 2012-02-01 18:33:41
http://*.com/questions/4766201/javascript-invert-color-on-all-元素一页 – j08691 2012-02-01 18:36:13