网站首页 手机版
 注册 登录
您现在的位置: 畅无忧设计 >> 网页特效 >> 网站常用 >> 正文
最新文章
· JavaScript实现文本段落折叠展开和收
· 拖动滑块选择范围的网页插件代码
· JS版元素周期表
· jQuery数字统计并生成进度条动画的代
· 一个不错的CSS分页样式
· 实用的Flash全屏和退出全屏切换效果
· 纯CSS实现三列DIV等高布局
· jquery四色网页换肤代码
· 可展开和收起的在线客服代码
· 功能强大的漂亮计算器
热门文章
 登录时用Cookie保存用户名和密码
 获取16进制颜色值的取色器
 一个小型的JS在线文本编辑器
 JavaScript实现文本段落折叠展开和
 利用js给li标签添加序号
 通过QQ查询QQ用户的头像、昵称、地
 可展开和收起的在线客服代码
 js取色器
 基于jQuery的对象切换插件soChange
 javascript让状态栏不显示链接地址
相关文章
js取色器
获取16进制颜色值的取色器
来源:蓝色理想 更新时间:2010/8/13 20:58:43 阅读次数: 我要投稿
△运行 ☉预览 #复制 +收藏
特效代码:
<table align=center> 
<tr><td align=center> 
<b>鼠标取色</b><hr noshade color=red size=1> 
</td></tr> 
<tr><td class=st9> 
<b>使用方法:</b><br> 
<ul>
<li>1、先在左边的色域内点击鼠标左键选择颜色 
<li>2、然后在右边的色域内用左键选择亮度 
<li>3、再将生成的颜色代码粘贴复制到上面的设置框中 
<hr noshade color=red size=1> 
</ul>
</td></tr> 
<tr><td> 
<SCRIPT language=JavaScript> 
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 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); 

SelColor.value = DoColor(RGB.innerText, GRAY.innerText); 
ShowColor.bgColor = SelColor.value; 

</SCRIPT> 
<SCRIPT event=onclick for=ColorTable language=JavaScript> 
SelRGB = event.srcElement.bgColor; 
EndColor(); 
</SCRIPT> 
<SCRIPT event=onmouseover for=ColorTable language=JavaScript> 
RGB.innerText = event.srcElement.bgColor; 
EndColor(); 
</SCRIPT> 
<SCRIPT event=onmouseout for=ColorTable language=JavaScript> 
RGB.innerText = SelRGB; 
EndColor(); 
</SCRIPT> 
<SCRIPT event=onclick for=GrayTable language=JavaScript> 
SelGRAY = event.srcElement.title; 
EndColor(); 
</SCRIPT> 
<SCRIPT event=onmouseover for=GrayTable language=JavaScript> 
GRAY.innerText = event.srcElement.title; 
EndColor(); 
</SCRIPT> 
<SCRIPT event=onmouseout for=GrayTable language=JavaScript> 
GRAY.innerText = SelGRAY; 
EndColor(); 
</SCRIPT> 
<SCRIPT event=onclick for=Ok language=JavaScript> 
window.returnValue = SelColor.value; 
window.close(); 
</SCRIPT> 
<DIV align=center> 
<CENTER> 
<TABLE border=0 cellPadding=0 cellSpacing=10> 
<TBODY> 
<TR> 
<TD> 
<TABLE border=0 cellPadding=0 cellSpacing=0 id=ColorTable 
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> 
<TBODY></TBODY></TABLE></TD> 
<TD> 
<TABLE border=0 cellPadding=0 cellSpacing=0 id=GrayTable 
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> 
<TBODY></TBODY></TABLE></TD></TR></TBODY></TABLE></CENTER></DIV> 
<DIV align=center> 
<CENTER> 
<TABLE border=0 cellPadding=0 cellSpacing=10 class=st9> 
<TBODY> 
<TR> 
<TD align=middle rowSpan=2>选中色彩 
<TABLE border=1 cellPadding=0 cellSpacing=0 height=40 id=ShowColor 
width=150> 
<TBODY> 
<TR> 
<TD></TD></TR></TBODY></TABLE></TD> 
<TD rowSpan=2>基色: <SPAN id=RGB></SPAN><BR>亮度: <SPAN 
id=GRAY>120</SPAN><BR>代码: <INPUT id=SelColor size=7 class=form_t></TD> 
</TR> 
</TBODY> 
</TABLE> 
</CENTER> 
</DIV> 
</td></tr></table>
△运行 ☉预览 #复制 +收藏
特效说明:
获取16进制颜色值的取色器
  • 上一篇文章:
  • 下一篇文章:
  • 关于我们 - 联系我们 - 广告服务 - 在线投稿 - 友情链接 - 网站地图 - 版权声明
    CopyRight 2008-2010, CWYDESIGN.COM - 畅无忧设计, Inc. All Rights Reserved
    滇ICP备09005765号