📄 5color.htm
字号:
tPlantz3.style.left = 297;
tPlantz4.style.left = 346;
break;
case '3':
tPlantz1.style.left = 210;
tPlantz2.style.left = 273;
tPlantz3.style.left = 338;
break;
case '2':
tPlantz1.style.left = 226;
tPlantz2.style.left = 322;
break;
default:
tPlantz1.style.left = 275;
break;
}
delete ModeNum,t,a,l,i;
}
function getPointInfo(m){
tPoint1.style.top = event.y - 7 + 'px';
tPoint1.style.left = event.x - 7 + 'px';
tPlantz1.style.top = 230;
var e = event.srcElement;
var r = NumToDec(e.style.background.substring(1,3),16);
var g = NumToDec(e.style.background.substring(3,5),16);
var b = NumToDec(e.style.background.substring(5,7),16);
var l = parseInt(e.H.split(',')[0]); //当前点的角度
var Round = e.H.split(',')[1]; //半径
tPointColor1.value = l;
CurAa.value = Round;
H4.value = l;
S4.value = 240;
V4.value = 240;
R4.value = r;
G4.value = g;
B4.value = b;
Color4HTML.value = RGBtoHTML(r,g,b);
WinReturnValue.value = Color4HTML.value;
tColorMode1.style.background = 'rgb('+r+','+g+','+b+')';
tColorS.style.background = 'rgb('+r+','+g+','+b+')';
var t = '',a = 360 / m;
var EX,EY;
//点数
for(i = 2; i <= m ; i++){
l += a;
l %= 360;
eval('tPointColor'+i+'.value = "'+l+'"');
t = nForColor(l);
EX = CircleX + parseInt(Round * Math.sin(3.14 * l / 180)) - 3;
EY = CircleY + parseInt(Round * Math.cos(3.14 * l / 180)) - 3;
eval('tPoint'+i+'.style.left = "'+ EX +'px";');
eval('tPoint'+i+'.style.top = "'+ EY +'px";');
r = NumToDec(t.substring(0,2),16);
g = NumToDec(t.substring(2,4),16);
b = NumToDec(t.substring(4,6),16);
eval('tColorMode'+i+'.style.background="rgb('+r+','+g+','+b+')";');
eval("tPlantz"+i+".style.top = 230;");
}
tColorSz.style.left = 67;
tColorSz.innerText = '∧240';
delete e,r,g,b,l,t,EX,EY,m,a,i,Round;
}
function tColorSchange(k){
var S = parseInt(240 - event.offsetX * 240 / 300);
var t = HSVtoRGB(H4.value,S * 100 / 240,V4.value * 100 / 240,true);
var r = '';
tColor1.style.background = 'rgb('+t+')';
if(k){
R4.value = t[0];
G4.value = t[1];
B4.value = t[2];
Color4HTML.value = RGBtoHTML(t[0],t[1],t[2]);
WinReturnValue.value = Color4HTML.value;
tColorSz.style.left = event.x - 7;
tColorSz.innerText = '∧' + S;
tColor2.style.background = 'rgb('+t+')';
S4.value = S;
for(i = 1;i <= 5 ; i++){
r = HSVtoRGB(eval('tPointColor'+i+'.value'),S * 100 / 240,100,true);
eval("tColorMode"+i+".style.background = 'rgb("+r+")';");
}
delete i;
}
delete S,t,k,r;
}
function tColorHchange(k,w){
var H = eval('tPointColor'+w+'.value');
var e = parseInt(event.offsetY * 240 / 160)
var t = HSVtoRGB(H,S4.value * 100 / 240,e * 100 / 240,true);
tColor1.style.background = 'rgb('+t+')';
if(k){
tColor2.style.background = 'rgb('+t+')';
H4.value = H;
R4.value = t[0];
G4.value = t[1];
B4.value = t[2];
Color4HTML.value = RGBtoHTML(t[0],t[1],t[2]);
WinReturnValue.value = Color4HTML.value;
eval('tPlantz'+w+'.style.top = 70 + event.offsetY;');
e = e / 240 * 255;
S4Line.style.background = 'rgb('+e+','+e+','+e+')';
t = HSVtoRGB(H,100,e * 100 / 240,true);
tColorS.style.background = 'rgb('+t+')';
delete V;
}
delete H,t,k,w;
}
//==[基本色]
function writeColorTable(){
var tc = document.createElement('Table');
var t=new Array()
tc.border = 0;
tc.cellSpacing = "0";
tc.cellPadding = "0";
tc.width = 370;
tc.height = 210;
tc.align = "center";
var r = new Object();
var c = new Object();
var i,j;
var k = new Array(0,0,0);
for(i = 0,j = 0;i <= 11;i++){
r = tc.insertRow(i);
r.className = 'TCBox';
for(j = 0; j <= 21; j++){
c = r.insertCell(j);
if(j == 0 || j == 2){
c.style.background = "rgb(0,0,0)";
}//end for cell 1,3
if(j == 1){
switch(i){
case 0: c.style.background = "rgb(0,0,0)";break;
case 1:c.style.background = "rgb(51,51,51)";break;
case 2:c.style.background = "rgb(102,102,102)";break;
case 3:c.style.background = "rgb(153,153,153)";break;
case 4:c.style.background = "rgb(204,204,204)";break;
case 5:c.style.background = "rgb(255,255,255)";break;
case 6: c.style.background = "rgb(255,0,0)";break;
case 7:c.style.background = "rgb(0,255,0)";break;
case 8:c.style.background = "rgb(0,0,255)";break;
case 9:c.style.background = "rgb(255,255,0)";break;
case 10:c.style.background = "rgb(0,255,255)";break;
default:c.style.background = "rgb(255,0,255)";break;
}
}//end for cell 2
if(j >= 3){
if(i >= 0 && i<= 5 && j >= 3 && j<= 8){
k[0] = 0;
k[1] = 51 * (j - 3);
}
if(i >= 6 && i<= 11 && j >= 3 && j<= 8){
k[0] = 153;
k[1] = 51 * (j - 3);
}
if(i >= 0 && i<= 5 && j >= 9 && j<= 14){
k[0] = 51;
k[1] = 51 * (j - 9);
}
if(i >= 6 && i<= 11 && j >= 9 && j<= 14){
k[0] = 204;
k[1] = 51 * (j - 9);
}
if(i >= 0 && i<= 5 && j >= 15 && j<= 20){
k[0] = 102;
k[1] = 51 * (j - 15);
}
if(i >= 6 && i<= 11 && j >= 15 && j<= 20){
k[0] = 255;
k[1] = 51 * (j - 15);
}
c.style.background = 'rgb('+k+')';
if(j == 21)
c.style.background = 'rgb(0,0,0)';
}//end for colorp
c.className = 'TCBox';
c.onMouseOver = 'qColor1.style.background=this.style.background;';
c.onMouseUp = 'emSelectColor();';
}//end for j
if((i + 1) % 6 == 0){
k[2] = 0;
}else{
k[2] += 51;
}
}//end for i
t[t.length]=(tc.outerHTML);
return t.join("")
}
function emSelectColor(){
var e = event.srcElement;
var t = e.style.background.substr(4).substr(0,e.style.background.length - 5).split(',');
qColor2.style.background = 'rgb('+t+')';
R5.value = t[0];
G5.value = t[1];
B5.value = t[2];
Color5HTML.value = RGBtoHTML(t[0],t[1],t[2]);
WinReturnValue.value = Color5HTML.value;
delete e,t;
}
</Script>
<!--[网页总宽度508,高度412]-->
<body onSelectStart="if(event.srcElement.tagName!='INPUT') return false;" scroll=no>
<table width="500" border="0" cellpadding="0" cellspacing="0" bgcolor="#EFEBDE">
<tr>
<td><table width="100%" height="25" border="0" cellpadding="0" cellspacing="0">
<tr align="center">
<td onClick="TitleOnChange(1)" id="ColorTitle_1" class="TitleSelect">七彩板</td>
<td onClick="TitleOnChange(2)" id="ColorTitle_2" class="TitleNoSelect">颜色条</td>
<td onClick="TitleOnChange(3)" id="ColorTitle_3" class="TitleNoSelect">拾色器</td>
<td onClick="TitleOnChange(4)" id="ColorTitle_4" class="TitleNoSelect">色 环</td>
<td onClick="TitleOnChange(5)" id="ColorTitle_5" class="TitleNoSelect">基本色</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="260" class="ColorBody">
<table id="Title1" width="500" height="260" border="0" cellpadding="0" cellspacing="0">
<tr>
<td rowspan="8" align="center"><table width="300" height="240" border="0" cellpadding="0" cellspacing="0">
<tr>
<td id=dc1></td>
</tr>
</table></td>
<td width="50" rowspan="8"><table width="40" height="240" border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="V1_Line" valign="top" style="background:rgb(153,153,153);" class="TCBox">
<span style="position:absolute; width:38px; height:120px; background:rgb(255,255,255); filter:alpha(startX=0,startY=0,finishX=0,finishY=100,opacity=100,finishopacity=0,style=1);"></span>
<span style="position:absolute; top:157px; width:38px; height:120px; background:rgb(0,0,0); filter:alpha(startX=0,startY=0,finishX=0,finishY=100,opacity=0,finishopacity=100,style=1);"></span>
<span onClick="Color1_LinePicker(true);" onMouseMove="if(event.button==1){Color1_LinePicker(true);}" style="position:absolute; width:38px; height:240px;"></span>
<span id="Color1_Expler" class="CustomerText" style="position:absolute; top: 150px; left: 360px;"><</span>
</td>
</tr>
</table></td>
<td width="50" align="right" class="CustomerText">色调:</td>
<td width="80"><input name="H1" type="text" class="TCBox" id="H1" value="0" size="5" maxlength="3"></td>
</tr>
<tr>
<td align="right" class="CustomerText">饱和度:</td>
<td width="80"><input name="S1" type="text" class="TCBox" id="S1" value="1" size="5" maxlength="3"></td>
</tr>
<tr>
<td align="right" class="CustomerText">亮度:</td>
<td width="80"><input name="V1" type="text" class="TCBox" id="V1" value="120" size="5" maxlength="3"></td>
</tr>
<tr>
<td align="right" class="CustomerText">红:</td>
<td width="80"><input name="R1" type="text" class="TCBox" id="R1" value="128" size="5" maxlength="3"></td>
</tr>
<tr>
<td align="right" class="CustomerText">绿:</td>
<td width="80"><input name="G1" type="text" class="TCBox" id="G1" value="128" size="5" maxlength="3"></td>
</tr>
<tr>
<td align="right" class="CustomerText">蓝:</td>
<td width="80"><input name="B1" type="text" class="TCBox" id="B1" value="128" size="5" maxlength="3"></td>
</tr>
<tr>
<td align="right" class="CustomerText">颜色:</td>
<td class="CustomerText"><input name="Color1HTML" type="text" class="TCBox" id="Color1HTML" value="#999999" size="7" maxlength="7"> </td>
</tr>
<tr>
<td colspan="2" align="center" class="CustomerText"><table width="100" height="60" border="0" cellpadding="0" cellspacing="1">
<tr align="center">
<td class="CustomerText">颜色</td>
<td class="CustomerText">选择</td>
</tr>
<tr>
<td id="xColor1" height="40" class="TCBox" style="background:rgb(153,153,153);"> </td>
<td id="xColor2" height="40" class="TCBox" style="background:rgb(153,153,153);"> </td>
</tr>
</table></td>
</tr>
</table>
<table id="Title2" width="500" height="260" border="0" cellpadding="0" cellspacing="0" style="display:none;">
<tr>
<td width="60" align="center" class="CustomerText">红:</td>
<td class="CustomerText">
<table width="300" height="30" border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="eRedD" class="TCBox" valign="top" style="background:rgb(255,0,0);">
<span id="Rj" style="position:absolute; left:43px; top:67px; width: 30px;" class="CustomerText">∧0</span>
<span id="eRedF" onMouseMove="eChangeR(1,false);if(event.button==1) eChangeR(1,true);" onClick="eChangeR(1,true);" style="width:300px; height:28px; background:rgb(0,0,0); filter:alpha(opacity=100,finishopacity=0,style=1);"></span>
</td>
</tr>
</table></td>
<td width="180" rowspan="4" align="center" class="CustomerText"><table width="100%" height="100%" border="0" cellpadding="3" cellspacing="1" class="CustomerText">
<tr>
<td width="45%" align="right">色调:</td>
<td width="55%"><input name="H2" type="text" class="TCBox" id="H2" value="0" size="5" maxlength="3"></td>
</tr>
<tr>
<td align="right">饱和度:</td>
<td><input name="S2" type="text" class="TCBox" id="S2" value="0" size="5" maxlength="3"></td>
</tr>
<tr>
<td align="right">亮度:</td>
<td><input name="V2" type="text" class="TCBox" id="V2" value="0" size="5" maxlength="3"></td>
</tr>
<tr>
<td align="right">红:</td>
<td><input name="R2" type="text" class="TCBox" id="R2" value="0" size="5" maxlength="3"></td>
</tr>
<tr>
<td align="right">绿:</td>
<td><input name="G2" type="text" class="TCBox" id="G2" value="0" size="5" maxlength="3"></td>
</tr>
<tr>
<td align="right">蓝:</td>
<td><input name="B2" type="text" class="TCBox" id="B2" value="0" size="5" maxlength="3"></td>
</tr>
<tr>
<td align="right">颜色:</td>
<td><input name="Color2HTML" type="text" class="TCBox" id="Color2HTML" value="#000000" size="7" maxlength="7"></td>
</tr>
<tr align="center">
<td colspan="2">
<table width="100" height="60" border="0" cellpadding="0" cellspacing="1">
<tr align="center">
<td class="CustomerText">颜色</td>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -