JavaScript Effects example 012-web Color Picker

Example 012 Web Color Picker Instance Descriptionuser-defined colors are often required in a Web site to display certain information. This can be achieved by adding a color picker to the Web page. Technical Essentialsin this example, only 216 browser-safe colors are used, the so-called Netscape color blocks. These 216 colors represent 0, 51, 102, 153, 204 of these 5 color values and each of the primary colors (i.e. red, green, blue). The hexadecimal numbers for these decimal values are 0x00, 0x33, 0x66, 0x99, 0xCC, and 0xFF, respectively. In the HTML color properties of black is #000000, pure red is #ff0000, pure green is #00ff00, pure blue is #0000ff, and White is #ffffff. You need to apply a JavaScript array when implementing a web color picker. There are three ways to create an array. (1) no parameter calls.

<span style= "White-space:pre" ></span>var h = new Array ()

(2) Specifies the value of the first n elements of the arrayvar h = new Array (arglist) (3) Specify the number of elements that have var h = new Array (n) Implementation process(1) Implement Click Color box, pop up web Color picker page index.html

<! DOCTYPE html>
(2) Web color picker color.html
<script language= "javascript" >var h = new Array (6); h[0] = "FF"; h[1] = "CC"; h[2] = ""; h[3] = "n"; h[4] = "the"; H[5] = "XX"; function action (RGB) {parent.window.returnValue = "#" +rgb;window.close ();} function Mcell (r,g,b) {document.write (' <td bgcolor= ' # ' +r+g+b+ ' "> ');d ocument.write (' <a href= ' #" onclick= " Action (\ ' + (r+g+b) + ' \ ') ' > ');d ocument.write ('  '); document.write (' </a> ');d ocument.write (' </td> ');} function Mtr (r,b) {document.write (' <tr> '); for (var i = 0; I <6; ++i) {Mcell (R, H[i], B);} document.write (' </tr> ');} function Mtable (B) {document.write (' <table cellpadding=0 cellspacing=0 border=0> '); for (var i = 0;i<6;++i) {Mtr (h[i],b);} document.write (' </table> ')}function Mcube () {document.write (' <table cellpadding=0 cellspacing=0 border=0 > '), for (var i = 0;i<6;++i) {if (i%3 = = 0) {document.write (' <tr> ')}document.write (' <td bgcolor= #000000 " > '); Mtable (H[i]);d OCUMENT.WRIte (' </td> ') if (i%3==2) {document.write (' </tr> ')}}document.write (' </table> ');} Mcube ();</script>
Note: The content of the style tag is the knowledge of CSS, and we focus on the content within the script tag. So this example of ours is done.



JavaScript Effects example 012-web Color Picker