js 颜色选择器
来源:互联网 发布:mac实用app推荐 编辑:程序博客网 时间:2024/05/17 00:57
<div>
<table cellspacing="1" cellpadding="3" width="350" align="center" bgcolor="#dddddd"
border="0">
<tbody>
<tr bgcolor="#ffffff">
<td align="middle" width="10%">
<select onchange="selectchg(this.value)" name="select1">
<option value="1" selected>红</option>
<option value="2">绿</option>
<option value="3">蓝</option>
<option value="4">灰</option>
</select>
</td>
<td align="middle" width="90%">
<table cellspacing="0" cellpadding="0" width="100%" border="0">
<tbody>
<tr>
<td align="right">
<input class="memo" size="10" name="text1">
<input class="button" onclick="choosecolor()" type="button" value=">>" name="Button2">
</td>
<td align="right" width="3%">
</td>
<td width="30%">
<table class="cursorcross" height="20" cellspacing="1" cellpadding="0" width="40"
border="0">
<tbody>
<tr>
<td id="customcolor" onmouseover="showcolor(this)" bgcolor="#ffffff">
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr bgcolor="#ffffff">
<td valign="middle" width="10%">
<table class="cursorhand" id="tableleft" cellspacing="1" cellpadding="0" border="0">
<script language="VBScript">
function hexit(which)
hexit=hex(which)
end function
</script>
<script language="JavaScript">
for (i = 0; i <= 15; ++i) {
document.write('<tr><td align="center">' + hexit(0 + i * 17) + '</td><td id="tdleft' + i + '" bgcolor="rgb(' + (0 + i * 17) + ',0,0)" width="15" height="15" onclick="changeright(this.num)" onmouseover="showcolor(this)"></td></tr>')
document.all['tdleft' + i].num = i
}
</script>
<tbody>
</tbody>
</table>
</td>
<td align="middle" width="90%">
<table class="cursorcross" id="tableleft" cellspacing="1" cellpadding="0" border="0">
<script language="JavaScript">
document.write('<tr><td></td>')
for (i = 0; i <= 15; ++i)
{ document.write('<td align="center">' + hexit(0 + i * 17) + '</td>') }
document.write('</tr>')
for (i = 0; i <= 15; ++i) {
document.write('<tr>')
document.write('<td align="center">' + hexit(0 + i * 17) + '</td>')
for (j = 0; j <= 15; ++j)
{ document.write('<td id="tdrightr' + i + 'c' + j + '" bgcolor="rgb(0,' + (0 + i * 17) + ',' + (0 + j * 17) + ')" width="15" height="15" onmouseover="showcolor(this)" onclick="clickright(this)"></td>') }
document.write('</tr>')
}
</script>
<tbody>
</tbody>
</table>
</td>
</tr>
<tr bgcolor="#ffffff">
<td colspan="2" height="20">
·可选16*16*16种颜色。<br>
·单击左边的颜色会得到更多的颜色。<br>
·单击右边的颜色会固定选取的颜色。
<br>
·输入框可以自定义颜色。
</td>
</tr>
</tbody>
</table>
<script language="JavaScript">
function selectchg(which) {
switch (which) {
case '1': leftR(); break;
case '2': leftG(); break;
case '3': leftB(); break;
case '4': leftA(); break;
}
}
function leftR() {
for (i = 0; i <= 15; ++i)
{ document.all['tdleft' + i].bgColor = 'rgb(' + (0 + i * 17) + ',0,0)' }
rightR(0)
}
function leftG() {
for (i = 0; i <= 15; ++i)
{ document.all['tdleft' + i].bgColor = 'rgb(0,' + (0 + i * 17) + ',0)' }
rightG(0)
}
function leftB() {
for (i = 0; i <= 15; ++i)
{ document.all['tdleft' + i].bgColor = 'rgb(0,0,' + (0 + i * 17) + ')' }
rightB(0)
}
function leftA() {
for (i = 0; i <= 15; ++i)
{ document.all['tdleft' + i].bgColor = 'rgb(' + (0 + i * 17) + ',' + (0 + i * 17) + ',' + (0 + i * 17) + ')' }
rightA()
}
function rightR(which) {
for (i = 0; i <= 15; ++i) {
for (j = 0; j <= 15; ++j)
{ document.all['tdrightr' + i + 'c' + j].bgColor = 'rgb(' + (0 + which * 17) + ',' + (0 + i * 17) + ',' + (0 + j * 17) + ')' }
}
}
function rightG(which) {
for (i = 0; i <= 15; ++i) {
for (j = 0; j <= 15; ++j)
{ document.all['tdrightr' + i + 'c' + j].bgColor = 'rgb(' + (0 + i * 17) + ',' + (0 + which * 17) + ',' + (0 + j * 17) + ')' }
}
}
function rightB(which) {
for (i = 0; i <= 15; ++i) {
for (j = 0; j <= 15; ++j)
{ document.all['tdrightr' + i + 'c' + j].bgColor = 'rgb(' + (0 + i * 17) + ',' + (0 + j * 17) + ',' + (0 + which * 17) + ')' }
}
}
function rightA() {
for (i = 0; i <= 15; ++i) {
for (j = 0; j <= 15; ++j)
{ document.all['tdrightr' + i + 'c' + j].bgColor = 'rgb(' + (0 + i * 16 + j) + ',' + (0 + i * 16 + j) + ',' + (0 + i * 16 + j) + ')' }
}
}
var rightclicked = false
function clickright(which) {
if (rightclicked) { rightclicked = false; showcolor(which) } else { rightclicked = true }
}
function changeright(which) {
switch (select1.value) {
case '1': rightR(which); break;
case '2': rightG(which); break;
case '3': rightB(which); break;
}
}
function showcolor(which) {
if (rightclicked) return;
text1.value = which.bgColor
choosecolor()
}
function choosecolor() {
customcolor.bgColor = text1.value
}
</script>
</div>
- js 颜色选择器
- js颜色选择器
- js颜色选择器
- 强大的jquery颜色选择器gradX.js
- 颜色选择器
- 颜色选择器
- 颜色选择器
- 颜色选择器
- 颜色选择器
- 颜色选择器
- 颜色选择器
- js颜色选择器修改版(兼容firefox,chrome)
- 文件选择器和颜色选择器
- js选择器
- js选择器
- js 选择器
- js选择器
- JS选择器
- 微软七月份安全补丁提前通知
- 程序还是房子
- 电脑装了linux虚拟机,今天突然不能上网怎么解决?
- keyCode值
- C#中播放声音文件
- js 颜色选择器
- 利用swftools将pdf转换为swf小例
- 1035: Web Navigator 栈的应用
- nrf学习程序
- JS获取Cookie
- 如何采用简化方法进行需求分析
- java编译出错,Exception in thread main java.langNoClassDefFoundError:Hello
- C#中实现label中文字循环滚动
- 影碟出租管理系统建库脚本.sql