jsp颜色rgb_jsp页面引入调色板、颜色表

jsp页面:

javascript脚本: $(document).ready(function() {    initPanel(); //初始化调色板    $("#fontColor").bind("click", OnDocumentClick); //fontColor:调用调色板的控件ID }); js内容: var ColorHex = new Array('00', '33', '66', '99', 'CC', 'FF'); var SpColorHex = new Array('FF0000', '00FF00', '0000FF', 'FFFF00', '00FFFF','FF00FF'); var current = null    //初始化调色板  function initPanel() {     var colorTable = ''     for (i = 0; i < 2; i++) {         for (j = 0; j < 6; j++) {             colorTable = colorTable + ''             colorTable = colorTable + ''             if (i == 0) {                 colorTable = colorTable + ''             }             else {                 colorTable = colorTable + ''             }             colorTable = colorTable + ''             for (k = 0; k < 3; k++) {                 for (l = 0; l < 6; l++) {                     colorTable = colorTable + ''                 }             }         }     }     colorTable = '
' + '
 
'        + '';            $("#colorpanel").html(colorTable);            $("#tblColor").bind("mouseover", doOver);            $("#tblColor").bind("mouseout", doOut);            $("#tblColor").bind("click", doclick);            $("#spnClose").bind("click", function(){           $("#colorpanel").css("display","none"); }           );    }                //鼠标覆盖事件    function doOver(event) {        var e = $.event.fix(event);        var element = e.target;        if ((element.tagName == "TD") && (current != element)) {                if (current != null) { current.style.backgroundColor = current.style.background; }            element.style.background = element.style.backgroundColor;            $("#DisColor").css("backgroundColor",            element.style.backgroundColor);            var clr = element.style.backgroundColor.toUpperCase();            if (clr.indexOf('RGB') > -1) {                clr = clr.substring(clr.length - 18);                clr = rgb2hex(clr);            }            $("#HexColor").val(clr);            //element.style.backgroundColor = "white";            current = element;        }    }            //鼠标移开事件            function doOut(event) {                if (current != null) current.style.backgroundColor =            current.style.background.toUpperCase();            }            //鼠标点击事件            function doclick(event) {                var e = $.event.fix(event);                if (e.target.tagName == "TD") {    var clr = e.target.style.background;                clr = clr.toUpperCase();                if (targetElement) {                    if (clr.indexOf('RGB') > -1) {                        clr = clr.substring(clr.length - 18);                        clr = rgb2hex(clr);                    }                    targetElement.value = clr;                 }                DisplayClrDlg(false, e);                return clr;            }        }                var targetElement = null;                function OnDocumentClick(event) {                    var e = $.event.fix(event);            var srcElement = e.target;  //         if (srcElement.alt == "clrDlg") {            targetElement = srcElement;            DisplayClrDlg(true, e);  //       }  //       else {      //           while (srcElement && srcElement.id != "colorpanel") {  //               srcElement = srcElement.parentElement;  //           }  //           if (!srcElement) {  //               DisplayClrDlg(false, e);  //           }  //       }    }        //显示颜色对话框    //display 决定显示还是隐藏    //自动确定显示位置    function DisplayClrDlg(display, event) {    var clrPanel = $("#colorpanel");     if (display) {        var left = document.body.scrollLeft + event.clientX;         var top = document.body.scrollTop + event.clientY;         if (event.clientX + clrPanel.width > document.body.clientWidth) {             //对话框显示在鼠标右方时会出现遮挡将其显示在鼠标左方             left -= clrPanel.width;         }         if (event.clientY + clrPanel.height > document.body.clientHeight) {             //对话框显示在鼠标下方时会出现遮挡将其显示在鼠标上方             top -= clrPanel.height;         }         clrPanel.css("left", left);         clrPanel.css("top", top);         clrPanel.css("display", "block");     } else {         clrPanel.css("display", "none");     }  }     //RGB转十六进制颜色值    function zero_fill_hex(num, digits) {        var s = num.toString(16);        while (s.length < digits)            s = "0" + s;        return s;    }        function rgb2hex(rgb) {        if (rgb.charAt(0) == '#')            return rgb;        var n = Number(rgb);        var ds = rgb.split(/\D+/);        var decimal = Number(ds[1]) * 65536 + Number(ds[2]) * 256 + Number(ds[3]);        return "#" + zero_fill_hex(decimal, 6);    }
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值