»
EnglishFrenchVietnamese

Print - BIAB Colorwheel 2.5 - JavaScriptBank.com

Full version: jsB@nk » Background » BIAB Colorwheel 2.5
URL: https://www.javascriptbank.com/biab-colorwheel-2-5.html

BIAB Colorwheel 2.5 © JavaScriptBank.comHover over the wheel to view colors. This script displays colorful wheel on the web page, visitors move mouse on it to get color code. This script's submitted by Draco Merest.

Full version: jsB@nk » Background » BIAB Colorwheel 2.5
URL: https://www.javascriptbank.com/biab-colorwheel-2-5.html



CSS
<style type="text/css">   #imgdiv { position:relative; }   #clrdiv { position:relative; background-color:white; }  </style><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


JavaScript
<script langauge="javascript">/*   Draco Merest   biab@iinet.net.au*/patNum=0;a=new Array(255,0,0);d=new Array()d[0]=new Array(0,0,1);d[1]=new Array(-1,0,0);d[2]=new Array(0,1,0);d[3]=new Array(0,0,-1);d[4]=new Array(1,0,0);d[5]=new Array(0,-1,0);c=new Array();for(i=0;i<6;i++) for(k=0;k<360/6;k++)  for(j=0;j<3;j++)   a[j]=a[j]+((255*6/360)*d[i][j])sum=0;s=new Array(60);for(i=0;i<2;i++) for(j=1;j<61;j++)  if(i==0)   { s[j]=new Array(0,0,Math.sin(j*90/60*0.01745329));     sum+=s[j][2]; }  else   { s[j][2]=s[j][2]*255/sum; };clr=new Array();for(i=0;i<6;i++) for(k=60;k>0;k--)  { clr[clr.length]=new Array(3);    s[k][0]=s[61-k][2]    for(j=0;j<3;j++)     { a[j]+=s[k][d[i][j]+1]*d[i][j];       if(k==1)        a[j]=(a[j]>128)?255:0;       clr[clr.length-1][j]=a[j];     };  };function capture() { if(document.layers)    { with(document.layers['imgdiv'])       { document.captureEvents(Event.MOUSEMOVE);         document.onmousemove=moved; }; }   else { document.all.imgdiv.onmousemove=moved; }; };quad=new Array(-180,360,180,0);function moved(e) { if(document.layers)    { sx=e.layerY-256;      sy=e.layerX-256;    }   else if(document.all)    { sx=event.offsetY-256;      sy=event.offsetX-256;    }   else if (document.getElementById)    { sy = (e.pageX - document.getElementById("imgdiv").offsetLeft)-256;      sx = (e.pageY - document.getElementById("imgdiv").offsetTop)-256;    };   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[2*((sy<0)?0:1)+((sx<0)?0:1)]-d));   r=Math.sqrt((xa*xa)+(ya*ya));   if(patNum==1) deg+=Math.floor(r);window.status=deg;   c=new Array(3);   hc="";   for(i=0;i<3;i++)    { c[i]=Math.floor(clr[deg%360][2-i]*r/128);      if(r>128 && c[i]<255)       { nc=(r-128)/128*255;         if(c[i]<nc)          c[i]=nc;       };      if(c[i]>255)       c[i]=255;      hc+=((c[i]<16)?"0":"")+Math.floor(c[i]).toString(16);    };   if(document.layers)    { document.layers['clrdiv'].bgColor="#"+hc; }   else    { document.getElementById("clrdiv").style.backgroundColor="#"+hc; };   document.frm.txt.value="#"+hc;   document.frm.hid.value="#"+hc;   return false; };function setcolor() { document.frm.sel.value=document.frm.hid.value; };function change() { patNum=1-patNum;   document.getElementById("theImg").src="image"+patNum+".jpg"; };</script><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<body onload="capture();"><table border=0 cellpadding=0 cellspacing=0> <tr><td><div id=imgdiv><a href="javascript:void(0);" onclick="setcolor(); return false;">  <img src="image0.jpg" width=512 height=512 border=0 id="theImg"></a></div></td></tr> <tr><td align="center"><div id=clrdiv>262144 colors to choose from</div></td></tr> <tr><form name="frm"><td align="center"><input type="text" name="txt" size=12>  <input type="text" name="sel" size=12>  <input type="button" value="Change" onclick="change();"> <input type="hidden" name="hid"></td></form></td></tr> <tr><td> <a href="index2.php" target=_blank>Use another wheel</a><br> <a href="../javascript/background---color-circling-picker-javascript.html">Original Version 2 Revision 5</a></td></tr></table></body><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


Files
http://javascriptbank.com/javascript/utility/BIAB_Colorwheel_2.5/Image0.jpghttp://javascriptbank.com/javascript/utility/BIAB_Colorwheel_2.5/Image1.jpg