谁有好的颜色选择器?

这个请参考一下:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
<TITLE> New Document </TITLE> 
<META NAME="Generator" CONTENT="EditPlus"> 
<META NAME="Author" CONTENT="llrock-百乐宝"> 
<META NAME="Keywords" CONTENT=""> 
<META NAME="Description" CONTENT=""> 
<style> 
.MyButton { 
    background: threedhighlight; 
    border-top:1px solid #000000; 
    border-right: 1px solid #000000; 
    border-bottom:1px solid #000000; 
    border-left: 1px solid #000000; 
} 
</style> 
<SCRIPT LANGUAGE="JavaScript"> 
<!-- 
function roundM(x){ 
return Math.floor(x); 
} 
function roundP(x){ 
return Math.round(x)+(1-Math.round(x)+Math.floor(x)); 
} 
function frac(x){ 
return x-Math.floor(x); 
} 
function Transform(ColorArr,TEXT) 
{ 
var HTML=""; 
TLen=TEXT.length; 
CLen=ColorArr.length; 
for(i=0;i<TLen;++i) 
{ 
ind=i*(CLen-1)/(TLen-1); 
if(Math.floor(ind)==ind) 
{ 
sc=ColorArr[Math.round(ind)]; 
ir=(sc&0xff0000)>>16; 
ig=(sc&0x00ff00)>>8; 
ib=(sc&0x0000ff); 
}else{ 
sc=ColorArr[roundM(ind)]; 
     ec=ColorArr[roundP(ind)]; 
     sr=(sc&0xff0000)>>16; 
     sg=(sc&0x00ff00)>>8; 
     sb=(sc&0x0000ff); 
     er=(ec&0xff0000)>>16; 
     eg=(ec&0x00ff00)>>8; 
     eb=(ec&0x0000ff); 
     ir=sr+Math.round(frac(ind)*(er-sr)); 
     ig=sg+Math.round(frac(ind)*(eg-sg)); 
     ib=sb+Math.round(frac(ind)*(eb-sb)); } 
HTML+='<font color="'+RgbToHtml(ir,ig,ib)+'">'+TEXT.charAt(i)+'</font>'; 
} 
return HTML; 
} 
function AddColor(CPID,ColorArr) 
{ 
var color=CPID.ChooseColorDlg(); 
ColorArr.push(color); 
panel.innerHTML+='<button class="MyButton" style="background-color:#'+IntToHex(color,6)+'">#'+IntToHex(color,6)+'</button>'; 
} 
function IntToHex(INT,n) 
{ 
var Hex=INT.toString(16); 
while(Hex.length<n)Hex="0"+Hex; 
return Hex; 
} 
function RgbToHtml(red,green,blue) 
{ 
var c="#"; 
c+=IntToHex(red,2); 
c+=IntToHex(green,2); 
c+=IntToHex(blue,2); 
return c; 
} 
//--> 
</SCRIPT> 
</HEAD> 
<BODY> 
<OBJECT id=ColorPanel CLASSID="clsid:3050f819-98b5-11cf-bb82-00aa00bdce0b" height=0 width=0></OBJECT><BR> 
<span id=Displayer></span> 
<BR> 
<HR> 
输入文本：<input id=TextBoard class="MyButton" value="This script is made by llrock.I love bbrock.2002-5-4" size="100"> 
<BR> 
<button class="" onclick="Colors=new Array();panel.innerHTML='';">删除颜色序列</button> 
<button class="" onclick="AddColor(ColorPanel,Colors)">添加颜色</button> 
<span id=panel> 
<button class="MyButton" style="background-color:#0000ff">#0000ff</button> 
<button class="MyButton" style="background-color:#00ff00">#00ff00</button> 
<button class="MyButton" style="background-color:#ff0000">#ff0000</button> 
</span> 
<BR> 
<button class="" onclick="Displayer.innerHTML=Transform(Colors,TextBoard.value);">转换</button> 
<HR> 
<TEXTAREA NAME="HTMLCode" class="MyButton" ROWS="10" COLS="100"></TEXTAREA> 
<SCRIPT LANGUAGE="JavaScript"> 
<!-- 
Colors=new Array(); 
Colors[Colors.length]=0x0000ff; 
Colors[Colors.length]=0x00ff00; 
Colors[Colors.length]=0xff0000; 
Displayer.innerHTML=Transform(Colors,TextBoard.value); 
HTMLCode.innerText=Transform(Colors,TextBoard.value); 
//--> 
</SCRIPT> </BODY> 
</HTML> 

解决方案 »

  1.   

    参考一：
    function showColorPicker()
    {if(document.all("colorTable").style.display=="none")
      document.all("colorTable").style.display="";
      else
      document.all("colorTable").style.display="none";
      var baseColor=new Array(6);
      baseColor[0]="00"; 
      baseColor[1]="33";
      baseColor[2]="66";
      baseColor[3]="99";
      baseColor[4]="CC";
      baseColor[5]="FF";
      var myColor;
      myColor="";
      var myHTML;
      myHTML="<table width=300 border=1 cellPadding=0 cellSpacing=0 bordercolordark='#ffffff' bordercolorlight='#000000'><tr><td bgcolor=#cccccc>  <input id=colorInput size=6 disabled style='BACKGROUND-COLOR: #cccccc;  BORDER-BOTTOM-COLOR: #000000; BORDER-BOTTOM-WIDTH: 1px; BORDER-LEFT-COLOR: #000000; BORDER-LEFT-WIDTH: 1px;BORDER-RIGHT-COLOR: #000000; BORDER-RIGHT-WIDTH: 1px; BORDER-TOP-COLOR: #000000; BORDER-TOP-WIDTH: 1px'><span id=colorText></span></td></tr><tr><td>";
      myHTML=myHTML+"<table width='100%' border='0' cellpadding='0' cellspacing='1' bgcolor=#000000>";  
      for(i=0;i<6;i++)
      {myHTML=myHTML+"<tr height=10>";
          for(j=0;j<3;j++)
           {  for(k=0;k<6;k++)
              {         
                myColor=baseColor[j]+baseColor[k]+baseColor[i];
                myHTML=myHTML+"<td width='10' onmouseover='selectColor(this.bgColor)' height='10' bgColor='"+myColor+"'></td>";
              }
             }
        myHTML=myHTML+"</tr>";   
      }    
      for(i=0;i<6;i++)
      {myHTML=myHTML+"<tr height=10>";
          for(j=3;j<6;j++)
           { for(k=0;k<6;k++)
              {         
                myColor=baseColor[j]+baseColor[k]+baseColor[i];//get Color
                myHTML=myHTML+"<td width='10' onmouseover='selectColor(this.bgColor)' height='10' bgColor='"+myColor+"'></td>";
              }
            }
        myHTML=myHTML+"</tr>";   
      }
      
      myHTML=myHTML+"</table>";
      myHTML=myHTML+"</td></tr></table>";
      document.all("colorTable").innerHTML=myHTML;  
    }
    function selectColor(colorStr)
    { document.all("colorText").innerHTML="  "+colorStr;
       document.all("colorInput").style.backgroundColor=colorStr;
       
    }