51、取色器

51、取色器

要完成此效果需要三个步骤

 

第一步:把如下代码加入到<head>区域中

 

<script>

addary = new Array();           //red

addary[0] = new Array(0,1,0);   //red green

addary[1] = new Array(-1,0,0);  //green

addary[2] = new Array(0,0,1);   //green blue

addary[3] = new Array(0,-1,0);  //blue

addary[4] = new Array(1,0,0);   //red blue

addary[5] = new Array(0,0,-1);  //red

addary[6] = new Array(255,1,1);

clrary = new Array(360);

for(i = 0; i < 6; i++)

for(j = 0; j < 60; j++) {

clrary[60 * i + j] = new Array(3);

for(k = 0; k < 3; k++) {

clrary[60 * i + j][k] = addary[6][k];

addary[6][k] += (addary[i][k] * 4);

   }

}

function capture() {

if(document.layers) {

layobj = document.layers['wheel'];

layobj.document.captureEvents(Event.MOUSEMOVE);

layobj.document.onmousemove = moved;

}

else {

layobj = document.all["wheel"];

layobj.onmousemove = moved;

   }

}

function moved(e) {

y = 4 * ((document.layers)?e.layerX:event.offsetX);

x = 4 * ((document.layers)?e.layerY:event.offsetY);

sx = x - 512;

sy = y - 512;

qx = (sx < 0)?0:1;

qy = (sy < 0)?0:1;

q = 2 * qy + qx;

quad = new Array(-180,360,180,0);

xa = Math.abs(sx);

ya = Math.abs(sy);

d = ya * 45 / xa;

if(ya > xa) d = 90 - (xa * 45 / ya);

deg = Math.floor(Math.abs(quad[q] - d));

n = 0;

sx = Math.abs(x - 512);

sy = Math.abs(y - 512);

r = Math.sqrt((sx * sx) + (sy * sy));

if(x == 512 & y == 512) {

c = "000000";

}

else {

for(i = 0; i < 3; i++) {

r2 = clrary[deg][i] * r / 256;

if(r > 256) r2 += Math.floor(r - 256);

if(r2 > 255) r2 = 255;

n = 256 * n + Math.floor(r2);

}

c = n.toString(16);

while(c.length < 6) c = "0" + c;

}

if(document.layers) {

document.layers["wheel"].document.f.t.value = "#" + c;

document.layers["wheel"].bgColor = "#" + c;

}

else {

document.all["wheel"].document.f.t.value = "#" + c;

document.all["wheel"].style.backgroundColor = "#" + c;

}

return false;

}

</script>

 

 

第二步:把如下代码加入到<body>区域中

 

<div id=wheel style="position:absolute; visibility:visible;; width: 256px; height: 256px; left: 263px; top: 14px">

  <table border=0 cellpadding=0 cellspacing=0>

<tr>

<td>

<img src="images/1.jpg" width=256 height=256 border=0>

</td>

</tr>

<tr>

<td align="center">

<br>

<form name="f">

<input type="text" name="t" size=27>

</form>

</td>

</tr>

</table>

</div>

 

 

第三步:把“onLoad="capture()"”加在<body>标记里

例如:<body onLoad="capture()">

 

Write a comment

Comments: 0