专注于互联网--专注于架构

 最新标签
网站地图
文章索引
Rss订阅

首页 »Dreamweaver » js控制背景色:用户自己控制背景色的实现 »正文

js控制背景色:用户自己控制背景色的实现

来源: 发布时间:星期四, 2009年2月12日 浏览:340次 评论:0


特效演示:
红
绿
蓝



把如下代码加入<body>区域中
<script language=\"JavaScript\">
<!-- Hiding

var red=0;
var green=0;
var blue=0;
var value=0;
var convert = Array
var hexbase= Array(\"0\", \"1\", \"2\", \"3\", \"4\", \"5\", \"6\", \"7\", \"8\", \"9\", \"A\", \"B\", \"C\", \"D\", \"E\", \"F\");

for (x=0; x<16; x){
for (y=0; y<16; y){
convert[value]= hexbase[x] + hexbase[y];
value;
}
}

function clear{
document.color.bl.value= blue;
document.color.rd.value= red;
document.color.gr.value= green;
}

function display{
redx = convert[red]
greenx = convert[green]
bluex = convert[blue]
var rgb = \"#\"+redx+greenx+bluex;
document.color.rgbdspl.value= rgb;
document.bgColor =rgb;
}

function upred(x){
((red+x)<=255)
redx
document.color.rd.value= red;
display
}

function downred(x){
((red-x)>=0)
red-=x
document.color.rd.value= red;
display
}

function upgreen(x){
((green+x)<=255)
greenx
document.color.gr.value= green;
display
}

function downgreen(x){
((green-x)>=0)
green-=x
document.color.gr.value= green;
display
}

function upblue(x){
((blue+x)<=255)
bluex
document.color.bl.value= blue;
display
}

function downblue(x){
((blue-x)>=0)
blue-=x
document.color.bl.value= blue;
display
}

// done hiding -->
</script>
<form name=\"color\">
<table>
<tr align=\"Center\">
<td>
<input name=\"red\" type=\"button\" value=\" +50 \" _disibledevent=></td>
<td>
<input name=\"red2\" type=\"button\" value=\" + 10 \" _disibledevent=></td>
<td>
<input name=\"red2\" type=\"button\" value=\" + 1\" _disibledevent=></td>
<td width=\"50\"><font color=\"#FF0000\" size=+3><b><font color=\"#FA0000\">红</font></b></font></td>
<td>
<input name=\"red-\" type=\"button\" value=\" - 1\" _disibledevent=></td>
<td>
<input name=\"red-\" type=\"button\" value=\" - 10 \" _disibledevent=></td>
<td>
<input name=\"red-\" type=\"button\" value=\" -50 \" _disibledevent=></td>
<td>
<input type=\"text\" name=\"rd\" size=3>
</td>
</tr>
<tr align=\"Center\">
<td>
<input name=\"green\" type=\"button\" value=\" +50 \" _disibledevent=></td>
<td>
<input name=\"green\" type=\"button\" value=\" + 10 \" _disibledevent=></td>
<td>
<input name=\"green\" type=\"button\" value=\" + 1\" _disibledevent=></td>
<td width=\"50\"><font color=\"#00FF00\" size=+3><b><font color=\"#00FA00\">绿</font></b></font></td>
<td>
<input name=\"green-\" type=\"button\" value=\" - 1\" _disibledevent=></td>
<td>
<input name=\"green-\" type=\"button\" value=\" - 10 \" _disibledevent=></td>
<td>
<input name=\"green-\" type=\"button\" value=\" -50 \" _disibledevent=></td>
<td>
<input type=\"text\" name=\"gr\" size=3>
</td>
</tr>
<tr align=\"Center\">
<td>
<input name=\"blue\" type=\"button\" value=\" +50 \" _disibledevent=></td>
<td>
<input name=\"blue\" type=\"button\" value=\" + 10 \" _disibledevent=></td>
<td>
<input name=\"blue\" type=\"button\" value=\" + 1\" _disibledevent=></td>
<td width=\"50\"><font color=\"#0000FF\" size=+3><b><font color=\"#0000FA\">蓝</font></b></font></td>
<td>
<input name=\"blue-\" type=\"button\" value=\" - 1\" _disibledevent=></td>
<td>
<input name=\"blue-\" type=\"button\" value=\" - 10 \" _disibledevent=></td>
<td>
<input name=\"blue-\" type=\"button\" value=\" -50 \" _disibledevent=></td>
<td>
<input type=\"text\" name=\"bl\" size=3>
</td>
</tr>
<tr align=\"Center\">
<td> </td>
<td> </td>
<td> </td>
<td width=\"50\">
<input type=\"text\" name=\"rgbdspl\" size=7>
</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</form>





标签：qq空间背景色 桌面图标背景色 背景色 js控制背景色
0
我顶

相关文章

读者评论

发表评论

  • 昵称：
  • 内容：

热门标签

精华推荐

最新标签

Dig排行

阅读排行

最新文章