整体页面代码:

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((arg0.constructor==Event || arg0.constructor ==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 DisColor=document.getElementById("DisColor");

var HexColor=document.getElementById("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)

{

aa=aa.replace("rgb(","")

aa=aa.replace(")","")

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; }

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);

document.getElementById("orange").value=bg;

alert("选取颜色: "+bg);

return bg;

}

}

所选色:

运行效果图:

html制作调色板,JS实现系统调色板相关推荐

  1. 16位调色板和32位调色板_设计系统的调色板第一部分

    16位调色板和32位调色板 重点(Top highlight) 第1部分(Part 1) I've been creating custom design systems for over five ...

  2. VBA调用系统调色板

    在Excel中设置单元格字体格式时,用户可以在调色板中选择颜色,如下图所示. 在VBA代码中如何提供调色板让用户选择颜色呢? 一种方法是调用Excel的系统对话框实现设置颜色,对话框如下图所示. Ap ...

  3. java计算机毕业设计爱心公益网站设计与制作源码+数据库+系统+lw文档+部署

    java计算机毕业设计爱心公益网站设计与制作源码+数据库+系统+lw文档+部署 java计算机毕业设计爱心公益网站设计与制作源码+数据库+系统+lw文档+部署 本源码技术栈: 项目架构:B/S架构 开 ...

  4. java毕业生设计爱心公益网站设计与制作计算机源码+系统+mysql+调试部署+lw

    java毕业生设计爱心公益网站设计与制作计算机源码+系统+mysql+调试部署+lw java毕业生设计爱心公益网站设计与制作计算机源码+系统+mysql+调试部署+lw 本源码技术栈: 项目架构:B ...

  5. 16位调色板和32位调色板_12种调色板提取器和站点色彩灵感资源

    16位调色板和32位调色板 Sometimes the hue muse fails to strike; sometimes all you're provided for the look and ...

  6. 16位调色板和32位调色板_整理色板和调色板的10个技巧

    知道自己有东西,但不知道它在哪里会令人沮丧. 对于您为设计项目创建或保存的颜色,尤其如此. 不得不遍历色样 , 浪费时间 ,只好在需要切换色相时重新开始搜索. 如果您经常使用吸管工具或将CMYK值插入 ...

  7. node mysql 模块化_Node.js 模块系统

    Node.js模块系统 为了让Node.js的文件可以相互调用,Node.js提供了一个简单的模块系统. 模块是Node.js 应用程序的基本组成部分,文件和模块是一一对应的.换言之,一个 Node. ...

  8. R语言使用ggplot2包使用geom_dotplot函数绘制分组点图(分组调色板填充、自定义调色板、灰度比例)实战(dot plot)

    R语言使用ggplot2包使用geom_dotplot函数绘制分组点图(分组调色板填充.自定义调色板.灰度比例)实战(dot plot) 目录 R语言使用ggplot2包使用geom_dotplot函 ...

  9. Auto.js 调用系统短信、电话

    本文所有教程及源码.软件仅为技术研究.不涉及计算机信息系统功能的删除.修改.增加.干扰,更不会影响计算机信息系统的正常运行.不得将代码用于非法用途,如侵立删! Auto.js 调用系统短信.电话 操作 ...

  10. excel制作录入和查询系统_excel表格制作成绩查询系统攻略:让学生隐私更安全!

    对于班主任来说,无论是收集学生信息,还是发布考试成绩,用得最多的就是excel表格了!很多老师在发布成绩的时候,多半会把统计好的表格直接发到群里让学生自行查询,这样一来虽然省事,但却极易招到投诉!下面 ...

最新文章

  1. Tomcat6 内存和线程配置
  2. python下载大文件-python requests 下载大文件不完整
  3. HDOJ 1056 HangOver
  4. JavaScript或jQuery中使用键盘控制对象运动
  5. Maven本地库添加Oracle JDBC驱动
  6. python制作软件excel_利用Python制作一个 截图+Excel操作浏览器小工具
  7. php实现栏目三种类型,WordPress后台edit-tags.php里无限栏目分类实现
  8. Winform软件,不要在线程里操作UI
  9. 一种语音识别模型的训练方法及装置与流程
  10. 【论文笔记】HyperFace: ADeep Multi-task Learning Framework for Face Detection
  11. 水滴IP教你如何查询QQ好友的IP地址
  12. 航空三字代码表_航空运输三字代码表
  13. 学习:对抗神经网络 - 恶意软件
  14. HTML5 混合APP开发学习笔记(三)——CSS样式设计
  15. 视频编辑常用软件有哪些
  16. 玩转B2B平台的商业模式你选对了吗?
  17. 项目型IT公司向产品型IT公司演进的必要性
  18. ACM常用模板-数据结构
  19. 计算机网络复习————概述,应用层,传输层
  20. vue向后台请求数据的配置和方法

热门文章

  1. 辽宁大学计算机专科专业,2020辽宁大学计算机考研专业课调整
  2. python导入numpy模块_Python之路-numpy模块
  3. 《python深度学习》笔记(八):回归问题
  4. 设计算法判断链表是否中心对称
  5. Hive split()、explode()和lateral view 应用单列,多列炸裂
  6. U盘插入电脑识别不出来,怎么解决?
  7. 前端第二章:6.浏览器的自动修复机制;网页布局 (header标签、main标签、footer标签;nav标签;aside标签)
  8. 基于AntDesign组件的Vue项目
  9. 平面设计师需要掌握哪些印刷知识
  10. 计算机CPU风扇的功能及作用,CPU和风扇之间涂的是什么东西