varname = location.search.substr(1);
function getcolor(event) {
var hex = [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 'A', 'B', 'C', 'D', 'E', 'F' ];
if (event.clientX > 164 || event.clientY > 164) {
return;
}
var hsv = new Object();
var h = 164;
var y = event.clientY;
hsv.h = 360 * event.clientX / 164;
if (y > h / 2) {
hsv.s = 1.0;
hsv.v = 2 * (h - y) / h;
} else {
hsv.v = 1.0;
hsv.s = y / (h / 2);
}
var rgb = hsvToRgb(hsv);
var red = Math.round(255 * rgb.r);
var green = Math.round(255 * rgb.g);
var blue = Math.round(255 * rgb.b);
hexstr = '#' + hex[(red - (red % 16)) / 16].toString()
+ hex[red % 16].toString()
+ hex[(green - (green % 16)) / 16].toString()
+ hex[green % 16].toString()
+ hex[(blue - (blue % 16)) / 16].toString()
+ hex[blue % 16].toString()
document.getElementById('box').style.backgroundColor =hexstr;
document.getElementById('colorhex').value =hexstr;
}
function hsvToRgb(hsv) {
var rgb = new Object();
var i, f, p, q, t;
if (hsv.s == 0) {
rgb.r = rgb.g = rgb.b = hsv.v;
return rgb;
}
hsv.h /= 60;
i = Math.floor(hsv.h);
f = hsv.h - i;
p = hsv.v * (1 - hsv.s);
q = hsv.v * (1 - hsv.s * f);
t = hsv.v * (1 - hsv.s * (1 - f));
switch (i) {
case 0:
rgb.r = hsv.v;
rgb.g = t;
rgb.b = p;
break;
case 1:
rgb.r = q;
rgb.g = hsv.v;
rgb.b = p;
break;
case 2:
rgb.r = p;
rgb.g = hsv.v;
rgb.b = t;
break;
case 3:
rgb.r = p;
rgb.g = q;
rgb.b = hsv.v;
break;
case 4:
rgb.r = t;
rgb.g = p;
rgb.b = hsv.v;
break;
default:
rgb.r = hsv.v;
rgb.g = p;
rgb.b = q;
break;
}
return rgb;
}
function setvalue(obj) {
parent.$(varname + '_v').value = obj.value + cvalueimg;
var sobj = parent.$(varname).style.background;
var sp = sobj.indexOf(' ');
var setstyle = '';
if (sp == -1) {
if (sobj.substr(0, 1) == '#') {
setstyle = obj.value;
}
} else {
if (sobj.substr(0, 1) == '#') {
setstyle = obj.value + ' ' + sobj.substr(sp + 1);
} else if (sobj.substr(sp + 1, 1) == '#') {
setstyle = obj.value + ' ' + sobj.substr(0, sp);
}
}
setstyle = setstyle != '' ? setstyle : obj.value;
parent.$(varname).style.background = setstyle;
document.getElementById('box').style.background = setstyle;
}
<script src="js/getcolor.js"> </script> <body onmousedown="getcolor(event);" scrolling="no"> <img src="img/color.jpg" style="cursor: crosshair; width: 164px; height: 164px"> <div id="box"></div> <input id="colorhex" style="padding: 2px; font: 12px Arial, Tahoma; cursor: pointer; width: 100%; border: 0px" onkeyup="setvalue(this)" onclick="setvalue(this)"> </body>
<script src="js/getcolor.js"> </script> <body onmousedown="getcolor(event);" scrolling="no"> <img src="img/color.jpg" style="cursor: crosshair; width: 164px; height: 164px"> <div id="box"></div> <input id="colorhex" style="padding: 2px; font: 12px Arial, Tahoma; cursor: pointer; width: 100%; border: 0px" onkeyup="setvalue(this)" onclick="setvalue(this)"> </body>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
