JavaScript 十六进制RGB色码转换器- Javascript

当前位置: 首页 > 图文教程 > 网络编程 > Javascript > JavaScript 十六进制RGB色码转换器

技术文章搜索

关键字

Javascript 中的 JavaScript 十六进制RGB色码转换器

出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-09-12 浏览: 181 ::

收藏到网摘: n/a

JQuery jsonp 使用示例代码一些不错的JS 自定义函数

JavaScript 十六进制RGB色码转换器,大家可以学习下思路。

点击运行可以看到效果:

<html>
<head>
<title>十六进制RGB色码转换器 风越ASP代码生成器</title>
</head>
<script type="text/javascript"></script>
<script type="text/javascript"></script>
<style></style><style bogus="1"> .slider_bar { background : menu;
font-size : 0;
z-index : 0;
top : auto;
left : 0; width : 9; height : 20; border : thin outset;
position : absolute;
cursor : NW-resize;
}
.slider {
top : auto;
left : 0;
position : absolute;
background: White;
font-size : 10;
height : 20;
z-index : 0;
width : 265;
border : thin inset;
text-align : center;
}
.small_box {
top : auto;
left : 270;
position : absolute;
font-size : 0;
height : 20;
z-index : 0;
width : 20;
border : thin inset;
text-align : center;
}
.large_box {
font-size : 0;
height : 40;
z-index : 0;
width : 40;
border : thin inset;
text-align : center;
}
.button { background : Menu;
top : auto;
left : auto;
position : absolute;
font-size : 12;
height : 20;
z-index : 0;
width : 120;
border : thin outset;
text-align : center; cursor : NW-resize;
}
.preset {
top : auto;
left : 270;
position : absolute;
font-size : 0;
height : 15;
z-index : 0;
width : 15;
border : thin inset;
text-align : center;
}
.slider_box{ top: auto; left : auto; position : absolute;
}</style>
<BODY onload="cur=test; set()">
<div><h1><font size="5"><font color="#FFFF00">十六进制</font><font color="#FF0000">R</font><font color="#008000">G</font><font color="#0000FF">B</font><font color="#FFFF00">色码转换器</font></font></h1></div>
<span id="test" class="large_box"></span>
<span id="R_value" class="slider" align="left" onclick="setColor('R')">R</span>
<span id="R_slider" class="slider_bar" value="R" onmouseDown="curD=this; dragging=true; start_drag(); this.style.background='white'" onMouseUp="this.style.background='menu'"></span>
<span id="rUp" class="small_box"></span>
<span id="G_value" class="slider" align="left" onclick="setColor('G')">G</span>
<span id="G_slider" class="slider_bar" value="G" onmouseDown="curD=this; dragging=true; start_drag(); this.style.background='white'" onMouseUp="this.style.background='menu'"></span>
<span id="gUp" class="small_box"></span>
<span id="B_value" class="slider" align="left" onclick="setColor('B')">B</span>
<span id="B_slider" class="slider_bar" value="B" onmouseDown="curD=this; dragging=true; start_drag(); this.style.background='white'" onMouseUp="this.style.background='menu'"></span>
<span id="bUp" class="small_box"></span>
<input size=7 maxlength="7" name="hex_color">
<span class="button" onClick="setFromHex()" onmouseDown="this.style.borderStyle='inset'" onmouseUp="this.style.borderStyle='outset'">转换</span>
<script type="text/javascript"></script>
<body>
</body>
</html>

[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

JQuery jsonp 使用示例代码一些不错的JS 自定义函数

Javascript 中的 JavaScript 十六进制RGB色码转换器

评论 (0) All