特效代码;仿WINDOW的纯JS超酷颜色选择器特效代码

<TITLE>仿WINDOW的纯JS超酷颜色选择器-破洛洛</TITLE> <STYLE TYPE="text/css"> td {font-size: 9pt} body {font-size: 10.8pt} BUTTON {width:5em;font-size:12px;} a{color:blue;} </STYLE> <SCRIPT LANGUAGE=JavaScript> function getMyColor(t) { var old_color = ( t.value.indexOf('#') == 0 ) ? '?'+t.value.substr(1) : '?' + t.value; var color = showModalDialog("/script/select_color.html"+old_color+"", "", "dialogWidth:18.5em; dialogHeight:17.5em; status:0"); if (color != null) { t.value = color; t.style.color = color; } else { t.focus(); } return true; } var SelRGB = ''; var DrRGB = ''; var SelGRAY = '120'; var hexch = new Array('0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F'); function initColor() { if ( location.search != '' && location.search != '?' ) { var old_color = location.search.substr(1); if ( /^[0-9A-Fa-f]{6}$/.test(old_color) ) { SelRGB = '#'+old_color; RGB.innerText = SelRGB; EndColor(); } else { SelColor.value = old_color; ShowColor.bgColor = SelColor.value; } } } function ToHex(n) { var h, l; n = Math.round(n); l = n % 16; h = Math.floor((n / 16)) % 16; return (hexch[h] + hexch[l]); } function DoColor(c, l) { var r, g, b; r = '0x' + c.substring(1, 3); g = '0x' + c.substring(3, 5); b = '0x' + c.substring(5, 7); if(l > 120) { l = l - 120; r = (r * (120 - l) + 255 * l) / 120; g = (g * (120 - l) + 255 * l) / 120; b = (b * (120 - l) + 255 * l) / 120; }else { r = (r * l) / 120; g = (g * l) / 120; b = (b * l) / 120; } return '#' + ToHex(r) + ToHex(g) + ToHex(b); } function EndColor() { var i; if(DrRGB != SelRGB) { DrRGB = SelRGB; for(i = 0; i <= 30; i ++) GrayTable.rows(i).bgColor = DoColor(SelRGB, 240 - i * 8); } if ( RGB.innerText == '') { initColor(); } else { SelColor.value = DoColor(RGB.innerText, GRAY.innerText); ShowColor.bgColor = SelColor.value; } } </SCRIPT> <SCRIPT LANGUAGE=JavaScript FOR=ColorTable EVENT=onclick> SelRGB = event.srcElement.bgColor; EndColor(); </SCRIPT> <SCRIPT LANGUAGE=JavaScript FOR=ColorTable EVENT=ondblclick> // 不用再按确定了 // 2006-7-26 added by http://www.hbcms.com window.returnValue = SelColor.value; window.close(); </SCRIPT> <SCRIPT LANGUAGE=JavaScript FOR=ColorTable EVENT=onmouseover> RGB.innerText = event.srcElement.bgColor; EndColor(); </SCRIPT> <SCRIPT LANGUAGE=JavaScript FOR=ColorTable EVENT=onmouseout> RGB.innerText = SelRGB; EndColor(); </SCRIPT> <SCRIPT LANGUAGE=JavaScript FOR=GrayTable EVENT=onclick> SelGRAY = event.srcElement.title; EndColor(); // 不用再按确定了 // 2006-7-26 added by http://www.hbcms.com window.returnValue = SelColor.value; window.close(); </SCRIPT> <SCRIPT LANGUAGE=JavaScript FOR=GrayTable EVENT=onmouseover> GRAY.innerText = event.srcElement.title; EndColor(); </SCRIPT> <SCRIPT LANGUAGE=JavaScript FOR=GrayTable EVENT=onmouseout> GRAY.innerText = SelGRAY; EndColor(); </SCRIPT> <SCRIPT LANGUAGE=JavaScript FOR=Ok EVENT=onclick> window.returnValue = SelColor.value; window.close(); </SCRIPT> </HEAD> <BODY bgcolor=menu style ='overflow:hidden;'> <span id=hbcms_select_color> <div align="center"><center><table border="0" cellspacing="10" cellpadding="0"><tr><td> <TABLE ID=ColorTable BORDER=0 CELLSPACING=0 CELLPADDING=0 style='cursor:hand'> <SCRIPT LANGUAGE=JavaScript> function wc(r, g, b, n) { r = ((r * 16 + r) * 3 * (15 - n) + 0x80 * n) / 15; g = ((g * 16 + g) * 3 * (15 - n) + 0x80 * n) / 15; b = ((b * 16 + b) * 3 * (15 - n) + 0x80 * n) / 15; document.write('<TD BGCOLOR=#' + ToHex(r) + ToHex(g) + ToHex(b) + ' height=8 width=8></TD>'); } var cnum = new Array(1, 0, 0, 1, 1, 0, 0, 1, 0, 0, 1, 1, 0, 0, 1, 1, 0, 1, 1, 0, 0); for(i = 0; i < 16; i ++) { document.write('<TR>'); for(j = 0; j < 30; j ++) { n1 = j % 5; n2 = Math.floor(j / 5) * 3; n3 = n2 + 3; wc((cnum[n3] * n1 + cnum[n2] * (5 - n1)), (cnum[n3 + 1] * n1 + cnum[n2 + 1] * (5 - n1)), (cnum[n3 + 2] * n1 + cnum[n2 + 2] * (5 - n1)), i); } document.writeln('</TR>'); } </SCRIPT> </TABLE></td><td> <TABLE ID=GrayTable BORDER=0 CELLSPACING=0 CELLPADDING=0 style='cursor:hand'> <SCRIPT LANGUAGE=JavaScript> for(i = 255; i >= 0; i -= 8.5) document.write('<TR BGCOLOR=#' + ToHex(i) + ToHex(i) + ToHex(i) + '><TD TITLE=' + Math.floor(i * 16 / 17) + ' height=4 width=20></TD></TR>'); </SCRIPT> </TABLE></td></tr></table></center></div> <div align="center"><center><table border="0" cellspacing="10" cellpadding="0"> <tr><td rowspan="2" align="center"> 选中色彩 <table ID=ShowColor border="1" width="50" height="30" cellspacing="0" cellpadding="0"> <tr><td></td></tr></table>  <BUTTON ONCLICK="initColor();" style="height:20px;width:50px;font-size:9pt;" onfocus="blur();">恢复</BUTTON> </td> <td rowspan="2">  帮助: 选色技巧 <BR> 基色: <SPAN ID=RGB></SPAN><BR> 亮度: <SPAN ID=GRAY>120</SPAN><BR> 代码: <INPUT TYPE=TEXT SIZE=7 ID=SelColor style="height:20px;font-size:9pt;"></td> <td><BUTTON ID=Ok TYPE=SUBMIT>确定</BUTTON></td></tr> <tr><td><BUTTON ONCLICK="window.close();">取消</BUTTON></td></tr> </table></center></div> </span> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> <span id=select_color_desc> <TABLE align=center> <TR> <TD> <B>仿WINDOW的纯JS超酷颜色选择器HBcms改良版本</B> <br>超酷效果：同window、office、各种网页编辑器的颜色选择器类似 <br>精巧实用：整个程序只有一个文件，9K，很方便整合到表单中 <br>改良内容： <BLOCKQUOTE> 1、增加传递颜色的功能。可以很方便的获取原来的颜色。 <br>2、增加了双击颜色返回颜色代码并关闭窗口 <br>3、色彩亮度颜色单击，返回颜色代码并关闭窗口 <br>4、增加了使用帮助 <br>5、增加了原颜色恢复按钮 <br>6、增加了网页使用说明及getMyColor函数</BLOCKQUOTE> 最新改良版本可以在这里下载：http://www.hbcms.com/ <br>为让他人使用本程序避免产生疑惑，使用时请包含本说明文字，谢谢 <P> </TD> </TR> </TABLE> </span> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </BODY> </HTML>

提示：您可以先修改部分代码再运行，复制代码和保存代码功能在Firefox下无效。

搜索

热门标签

特效代码;仿WINDOW的纯JS超酷颜色选择器特效代码