使用JavaScript脚本语言打造自己的色谱

samtang911 · 发表于 2009-1-25 19:22:25

色谱图对于每一个网站设计人员都是必不可少的，因为一个网站的颜色搭配是至关重要的,所以网站用色是网站建设必须要认真思考的问题。网站的色彩运用往往能够体现一个网站的个性及主题格调。所以，在设计网页时常常需要设置网页背景或其它网页元素的颜色，而网页设计软件如(如Dreamweaver)的调色板一般只有200多种色样供选择。假如你在设计网页时比较讲究用色，可以使用JavaScript脚本来定制自己的色谱，这将给你的设计工作带来很大的便利。下面就跟我一起来在做吧很简单，希望对大家有所帮助!
一下是显示色谱图的HTML代码和JavaScript脚本,如下：
<HTML>
<HEAD>
<TITLE>色谱图</TITLE>
<META HTTP-EQUIV="Content-Type" C>
</HEAD>
<BODY BGCOLOR="#FFFFFF">
<CENTER>
<h2>512色色谱图</h2>
<SCRIPT LANGUAGE="JavaScript">
//定义数组对象
clr=new Array('00','20','40','60','80','a0','c0','ff');
//创建8个8行8列的表格
for (i=0;i<8;i++) {
//创建表格，单元格内填充距8像素
document.write("<table border=1 cellpad**=8>");
for (j=0;j<8;j++) {
document.write("<tr>");
for (k=0;k<8;k++) {
//设置表格单元的背景颜色
document.write('<td bgcolor="#'+clr+clr[j]+clr[k]+'">');
//设置文字颜色
document.write('<tt><font color="#'+clr[7-i]+clr[7-j]+clr[7-k]+'"> ');
//显示16进制颜色值
document.write('#'+clr+clr[j]+clr[k]+' </font></tt></td>'); }

document.write("</tr>"); }
document.write("</table><br>"); }
</SCRIPT>
</CENTER>
</BODY>
</HTML>

这个色谱图由8个表格组成，每个表格为64种颜色。在你使用用时，复制你在色谱图中选定的颜色上的16进制颜色值，粘贴到颜色代码框中即可。

古镇小飞侠 · 发表于 2009-1-25 20:34:01

呵呵我试了效果不错。

中华！ · 发表于 2009-1-25 21:32:06

没分了，支持一下．

stevinchen · 发表于 2009-1-25 20:58:07

支持以下：）

爱翻天 · 发表于 2009-1-25 21:12:50

呵呵 ~效果不错。

冰love火 · 发表于 2009-1-25 20:52:18

这个帖子内容很不错谢谢分享

samtang911 · 发表于 2009-1-25 20:21:26

colorDialog=function()
      {
            if(event==null||event.srcElement==null)
            {
                     return;
            }
            var sInitColor=event.srcElement.value;
            if (sInitColor == null||sInitColor.length<1)
            {
                     var sColor = $("colordlgHelper").ChooseColorDlg();
            }
            else
            {
                     if(sInitColor.length>6)
                              sInitColor = sInitColor.substring(1);
                     var sColor = $("colordlgHelper").ChooseColorDlg(sInitColor);
            }
            sColor = sColor.toString(16);
            if (sColor.length < 6)
            {
                     var sTempString = "000000".substring(0,6-sColor.length);
                     sColor = sTempString.concat(sColor);
            }
            sInitColor = '#'+sColor;
            event.srcElement.value=sInitColor;
            if(event.srcElement.onchange)
            {
                     event.srcElement.fireEvent("onchange");
            }
            return sInitColor;
      }

<object id="colordlgHelper" classid="clsid:3050f819-98b5-11cf-bb82-00aa00bdce0b" width="0px" height="0px"></object>

一言两语 · 发表于 2009-1-25 21:22:22

美心 · 发表于 2009-1-25 21:22:47

还行，估计对我没什么用！！

宽容 · 发表于 2009-1-25 20:30:01

谢谢LZ分享

		自动登录	找回密码
密码			注册

使用JavaScript脚本语言打造自己的色谱

相关帖子

浏览过的版块