"JavaScript" Color picker

Conversion of color space RGB to HSV (HSL)

Good text recommendation: http://blog.csdn.net/jiangxinyu/article/details/8000999

conversion from HSV to RGB

Similarly, given a color defined in the HSV (H, s, v) values, with the Has above, and the s and v representing the saturation and lightness respectively, vary from 0 to Between 1, the corresponding (R, G, b) Primary colors in the RGB space can be calculated as:

For each color vector (r, G, b),

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">varColorPicker =function(idstr) { This. Colorpool = ["#000000", "#993300", "#333300", "#003300", "#003366", "#000080", "#333399", "#333333", "#800000", "#FF6600 "," #808000 "," #008000 "," #008080 "," #0000FF "," #666699 "," #808080 "," #FF0000 "," #FF9900 "," #99CC00 "," #339966 "," #33CCCC "," #3366FF "," #800080 "," #999999 "," #FF00FF "," #FFCC00 "," #FFFF00 "," #00FF00 "," #00FFFF "," #00CCFF "," #993366 "," #CCCCCC "," #FF99CC "," #FFCC99 "," #FFFF99 "," #CCFFCC "," #CCFFFF "," #99CCFF "," #CC99FF "," #FFFFFF "];  This. Initialize (IDSTR);} Colorpicker.prototype={initialize:function(idstr) {varCount=0; varhtml = ' '; varSelf = This; HTML+ = ' <table cellspacing= "5" cellpadding= "0" border= "2" bordercolor= "#000000" style= "cursor:pointer;background:# Ece9d8 "mce_style=" Cursor:pointer;background: #ECE9D8 ">"; //html+= ' <tr><td align= "center" colspan= "8" width= "" height= "" id= "" CurrentColor "bgcolor=" #ffffff " > Current Color </td></tr> ';   for(i=0;i<5;i++) {HTML+ = "<tr>";  for(j=0;j<8;j++) {HTML+ = ' <td align= "center" width= "height=" style= "background: ' + This. colorpool[count]+ ' "mce_style=" background: ' + This. colorpool[count]+ ' "unselectable=" on "> </td>"; Count++; } HTML+ = "</tr>"; } HTML+ = ' </table> ';  This. Trigger =document.getElementById (IDSTR);  This. div = document.createelement (' div ');  This. div.innerhtml =html; varTDS = This. Div.getelementsbytagname (' TD ');  for(vari=0,l=tds.length;i<l;i++) {Tds[i].onclick=function() {Self.setcolor ( This. Style.backgroundcolor); }  }   This. div.id = ' Mycolorpicker ';  This. Trigger.parentNode.appendChild ( This. Div);  This. div.style.position = ' absolute ';  This. Div.style.left = This. Trigger.offsetleft + ' px ' This. Div.style.top = ( This. Trigger.clientheight + This. trigger.offsettop) + ' px '; //this.hide ();   This. Trigger.onclick =function(){   if(Self.div.style.display = = ' None ') {self.show (); return false; }Else{self.hide (); return false; }}, SetColor:function(c) { This. Hide (); document.getElementById (' demo '). Style.backgroundcolor = C//Proeditor.setcolor (c);//self-defined function determines the function of SetColor}, Hide:function(){   This. Div.style.display = ' None '}, Show:function(){   This. Div.style.display = ' block ' }}// -</script><div ><a href= "#" mce_href= "#" onclick= "Initcolorpicker (); return false" Id= "Demo" style= " position:absolute;left:200px "> Color selection </a></div><script type=" Text/javascript "><!--functionInitcolorpicker () {Picker=NewColorPicker (' demo ');}// -</script></body>
"JavaScript" Color picker