15 diciembre 2008

Convertidor de códigos RGB a Hexadecimal

Con ésta herramienta, de gran utilidad en diseño web, podemos hacer las conversiones de códigos RGB a Hexadecimal. Sólo tendremos que copiar el código que dejo a continuación para colocarlo, si lo desean, en su página.



<!-- TWO STEPS TO INSTALL HEX-RGB CONVERTER: 1. Copy the coding into the HEAD of your HTML document 2. Add the last code into the BODY of your HTML document -->

<!-- STEP ONE: Paste this code into the HEAD of your HTML document -->

<script language="JavaScript"><br /><!-- Original: Ryan Sokol --><br /><!-- Web Site: http://www.logicode.net --><br /><br /><!-- This script and many more are available free online at --><br /><!-- The JavaScript Source!! http://javascript.internet.com --><br /><br /><!-- Begin function NumToHex(num1,num2) { strNum=document.forms[0].elements[num1].value; for(i = 0; i < chr="strNum.substring(i," chr ="=" value="'';"> 255) {<br />alert('You must enter a number between 0 and 255!');<br />document.forms[0].elements[num1].select();<br />document.forms[0].elements[num2].value='';<br />return false;<br />}<br />else {<br />base = strNum / 16;<br />rem = strNum % 16;<br />base = base - (rem / 16);<br />baseS = MakeHex(base);<br />remS = MakeHex(rem);<br />document.forms[0].elements[num2].value=baseS + '' + remS;<br />ChangeBackground(3, 4, 5);<br />return true;<br /> }<br />}<br />function MakeHex(x) {<br />if((x >= 0) && (x <= 9)) return x; else { switch(x) { case 10: return "A"; case 11: return "B"; case 12: return "C"; case 13: return "D"; case 14: return "E"; case 15: return "F"; } } } function HexToNum(num1,num2) { numberS = document.forms[0].elements[num1].value; tens = MakeNum(numberS.substring(0,1)); if(tens == 'X') { document.forms[0].elements[num1].select(); document.forms[0].elements[num2].value=''; return false; } ones = 0; if(numberS.length > 1) // means two characters entered<br />ones=MakeNum(numberS.substring(1,2));<br />if(ones == 'X') {<br />document.forms[0].elements[num1].select();<br />document.forms[0].elements[num2].value='';<br />return false;<br />}<br />document.forms[0].elements[num2].value = (tens * 16) + (ones * 1);<br />document.forms[0].elements[num1].value = document.forms[0].elements[num1].value.toUpperCase();<br />ChangeBackground(3, 4, 5);<br />return true;<br />}<br />function MakeNum(str) {<br />if((str >= 0) && (str <= 9)) return str; switch(str.toUpperCase()) { case "A": return 10; case "B": return 11; case "C": return 12; case "D": return 13; case "E": return 14; case "F": return 15; default: alert('You must choose a number between 0 and 9 or a letter between A and F!'); return 'X'; } } function ChangeBackground(num1, num2, num3) { document.bgColor = '#'+document.forms[0].elements[num1].value + document.forms[0].elements[num2].value + document.forms[0].elements[num3].value; } // End --><br /></script>

<!-- STEP TWO: Copy this code into the BODY of your HTML document -->
<form>
<table align="center" bgcolor="white" border="1" cellpadding="10">
<tbody><tr>
<th>Color/Code</th>
<th>Red</th>
<th>Green</th>
<th>Blue</th>
</tr>
<tr>
<th>0-255</th>
<td><input maxlength="3" onkeyup="return NumToHex(0,3);" name="rr_num" size="4" type="text"></td>
<td><input maxlength="3" onkeyup="return NumToHex(1,4);" name="gg_num" size="4" type="text"></td>
<td><input maxlength="3" onkeyup="return NumToHex(2,5);" name="bb_num" size="4" type="text"></td>
</tr>
<tr>
<th>HEX</th>
<td><input maxlength="2" onkeyup="return HexToNum(3,0);" name="rr_hex" size="4" type="text"></td>
<td><input maxlength="2" onkeyup="return HexToNum(4,1);" name="gg_hex" size="4" type="text"></td>
<td><input maxlength="2" onkeyup="return HexToNum(5,2);" name="bb_hex" size="4" type="text"></td>
</tr>
</tbody></table>
</form>
<p></p><center>
<span >Free JavaScripts provided
by <a href="http://javascriptsource.com/">The JavaScript Source</a></span>
</center><p>
<!-- Script Size: 3.91 KB --></p><p></p>


Este es el ejemplo:




















Color/CodeRedGreenBlue
0-255
HEX

0 comentarios:

Publicar un comentario

Tu comentario ser� moderado la primera vez que lo hagas al igual que si incluyes enlaces. A partir de ahi no ser necesario si usas los mismos datos y mantienes la cordura. No se publicar�n insultos, difamaciones o faltas de respeto hacia los lectores y comentaristas de este blog.