<ptml> <pead> <title> hexadecimal RGB color code converter Wind more ASP code generator </title> </pead> <!--step one: first copy the following code to < Head></pead> between:--> <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". Char At (n%16)} function set () {R=r_slider.style.pixelleft g=g_slider.style.pixelleft B=b_slider.style.pixelle FT 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=mat H.min (255,b) var color= "#" +tohex (R) +tohex (G) +tohex (B) Hex_color.value=color Cur.style.backgroundcolor=color Rup.style.backgroundcolor= "#" +tohex (R) + "+" + "gup.style.backgroundcolor=" "#" + "+tohex" (G) + "Bup.styl" E.backgroundcolor= "#" + "+" + "+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 can not have RGB values that are over 255!") Eval (curd.value+ "_value"). Innerhtml=curd.style.pixelleft} if (curd.style.pixelleft<0) {C Urd.style.pixelleft=0//alert ("Sorry, but you can don't 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> <!--Step Two: Then copy the following code to <body></body> between:--> <body onload= "cur=test; Set () "> <div><p><font size=" 5 "><font color=" #FFFF00 "> Hexadecimal </font><font color=" #FF0000 ">r</font><font color=" #008000 ">g</font><font color=" #0000FF ">B</font> <font color= "#FFFF00" > Color code Converters </font></font></p></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" "> Conversion </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_SL Ider.style.pixelleft=r g_slider.style.pixelleft=g b_slider.style.pixelleft=b r_value.innerhtml=r G_val Ue.innerhtml=g b_value.innerhtml=b set ()} function Todec (h) {return parseint (h,16)}//--></SCR ipt> <body> </body> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]