html实现颜⾊⾊板,JS实现的系统调⾊板完整实例
本⽂实例讲述了JS实现的系统调⾊板。分享给⼤家供⼤家参考，具体如下：
运⾏效果图如下：
整体页⾯代码：
DW调⾊板
var ColorHex=new Array('00','33','66','99','CC','FF')
var SpColorHex=new Array('FF0000','00FF00','0000FF','FFFF00','00FFFF','FF00FF')
var current=null
function getEvent()
{
if(document.all)
{
return window.event;//如果是ie
}
func=getEvent.caller;
while(func!=null)
{
var arg0=func.arguments[0];
if(arg0)
{
if((structor==Event || structor ==MouseEvent)||(typeof(arg0)=="object" && arg0.preventDefault && arg0.stopPropagation))
{
return arg0;
}
func=func.caller;
}
return null;
}
function intocolor()
{
var colorTable=''
for (i=0;i<2;i++) //循环2部分
{
for (j=0;j<6;j++) //循环6⾏
{
colorTable=colorTable+'
'
for (k=0;k<3;k++)
{
for (l=0;l<6;l++)
{
colorTable=colorTable+'
'
}
}
}
}
colorTable='
+'
'
+'
+'
当前⾊:'
+'
'
+'
+colorTable+'
';
colorpanel.innerHTML=colorTable
function doOver() {
var evt=getEvent();
var element=evt.srcElement || evt.target;
var ElementById("DisColor");
var ElementById("HexColor");
if ((element.tagName=="TD") && (current!=element)) {
if (current!=null){
current.style.backgroundColor = current._background
}
element._background = element.style.backgroundColor
DisColor.style.backgroundColor = rgbToHex(element.style.backgroundColor) HexColor.value = rgbToHex(element.style.backgroundColor)
element.style.backgroundColor = "white"
current = element
}
}
function rgbToHex(aa)
{
if(aa.indexOf("rgb") != -1)
{
place("rgb(","")
place(")","")
aa=aa.split(",")
r=parseInt(aa[0]);
g=parseInt(aa[1]);
b=parseInt(aa[2]);
r = r.toString(16);
if (r.length == 1) { r = '0' + r; }
g = g.toString(16);
if (g.length == 1) { g = '0' + g; }js arguments
b = b.toString(16);
if (b.length == 1) { b = '0' + b; }
return ("#" + r + g + b).toUpperCase();
else
{
return aa;
}
}
function doOut() {
if (current!=null) current.style.backgroundColor = current._background; }
function doclick(){
var evt=getEvent();
var element=evt.srcElement || evt.target;
if (element.tagName=="TD"){
var bg=rgbToHex(element._background);
alert("选取颜⾊: "+bg);
return bg;
}
}
所选⾊:
PS：这⾥再为⼤家推荐⼏款本站的相关在线⼯具：
希望本⽂所述对⼤家JavaScript程序设计有所帮助。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。