<div class="htmlarea"> <textarea id="runcode16662"> <title>十六进制RGB色码转换器 风越ASP代码生成器</title> <!--第一步：先将下列代码复制到<head></head>之间：--> <script type="text/javascript"><!-- var R=0 var G=0 var B=0 function toHex(N){ N=Math.max(0,N) N=Math.min(255,N) return "0123456789ABCDEF".charAt((N-N%16)/16) + "0123456789ABCDEF".charAt(N%16) } function set(){ R=R_slider.style.pixelLeft G=G_slider.style.pixelLeft B=B_slider.style.pixelLeft R=Math.max(0,R) R=Math.min(255,R) G=Math.max(0,G) G=Math.min(255,G) B=Math.max(0,B) B=Math.min(255,B) var color="#"+toHex(R)+toHex(G)+toHex(B) hex_color.value=color cur.style.backgroundColor=color rUp.style.backgroundColor="#"+toHex(R)+"00"+"00" gUp.style.backgroundColor="#"+"00"+toHex(G)+"00" bUp.style.backgroundColor="#"+"00"+"00"+toHex(B) } function setColor(v){ var x=event.clientX-5 if(x>255) x=255 if(x<0) x=0 eval(v+"_slider").style.pixelLeft=x eval(v+"_value").innerHTML=x set() } // --></script> <script type="text/javascript"><!-- var off,curD,dragging function start_drag(){ off=event.clientX-curD.style.pixelLeft } function drag(){ if(dragging){ x=event.clientX-off if(curD.style.pixelLeft>=0 && curD.style.pixelLeft<=255){ curD.style.pixelLeft=x eval(curD.value+"_value").innerHTML=curD.style.pixelLeft set() } if(curD.style.pixelLeft>255){ curD.style.pixelLeft=255; //alert("Sorry, but you can not have RGB values that are over 255!") eval(curD.value+"_value").innerHTML=curD.style.pixelLeft } if(curD.style.pixelLeft<0){ curD.style.pixelLeft=0 //alert("Sorry, but you can not have RGB values that are under 255!") eval(curD.value+"_value").innerHTML=curD.style.pixelLeft } } return false } document.onmousemove=drag document.onmouseup=new Function("dragging=false;") // --></script> <style><!-- .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> <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></body>之间：--> <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"><!-- function setFromHex(){ var h=hex_color.value if(h.charAt(0)=="#"){h=h.substring(1,h.length)} h=h.split("") var no="ghijklmnopqrstuvwxyz" for(var i=0;i<no.length;i++){ if(no.indexOf(h[i])!=-1){h[i]="F"} } h=h.join("") R=toDec(h.substring(0,2)) G=toDec(h.substring(2,4)) B=toDec(h.substring(4,6)) R_slider.style.pixelLeft=R G_slider.style.pixelLeft=G B_slider.style.pixelLeft=B R_value.innerHTML=R G_value.innerHTML=G B_value.innerHTML=B set() } function toDec(h){ return parseInt(h,16) } // --></script> </textarea><br><input onclick="runEx('runcode16662')" type="button" value="运行代码"> <input onclick="doCopy('runcode16662')" type="button" value="复制代码"> <input onclick="doSave(runcode16662)" type="button" value="保存代码">[Ctrl+A 全选 注:<a href="http://www.jb51.net/article/23421.htm" title="查看具体详情" target="_blank">如需引入外部Js需刷新才能执行</a>]</div>
