上一页 返回教程首页 下一页
名称
色阶板
实例
点击色块，显示16进制色彩代码
教程
第一步：拷贝下面的代码到你的html文件的<body>和</body>之间；
<SCRIPT LANGUAGE="JavaScript"> <!--// Copyright (c) 1996-1997 Tomer Shiran. All rights reserved.// Permission given to use the script provided that this notice remains as is.// Additional scripts can be found at http://www.geocities.com/~yehuda/// create 6-element arrayvar hex = new Array(6)// assign non-dithered descriptorshex[0] = "FF"hex[1] = "CC"hex[2] = "99"hex[3] = "66"hex[4] = "33"hex[5] = "00"// accept triplet string and display as background colorfunction display(triplet) { // set color as background color document.bgColor = '#' + triplet // display the color hexadecimal triplet alert('Background color is now ' + triplet)}// draw a single table cell based on all descriptorsfunction drawCell(red, green, blue) { // open cell with specified hexadecimal triplet background color document.write('<TD BGCOLOR="#' + red + green + blue + '">') // open a hypertext link with javascript: scheme to call display function document.write('<A HREF="javascript:display(\'' + (red + green + blue) + '\')">') // print transparent image (use any height and width) document.write('<IMG SRC="place.gif" BORDER=0 HEIGHT=12 WIDTH=12>') // close link tag document.write('</A>') // close table cell document.write('</TD>')}// draw table row based on red and blue descriptorsfunction drawRow(red, blue) { // open table row document.write('<TR>') // loop through all non-dithered color descripters as green hex for (var i = 0; i < 6; ++i) { drawCell(red, hex[i], blue) } // close current table row document.write('</TR>')}// draw table for one of six color cube panelsfunction drawTable(blue) { // open table (one of six cube panels) document.write('<TABLE CELLPADDING=0 CELLSPACING=0 BORDER=0>') // loop through all non-dithered color descripters as red hex for (var i = 0; i < 6; ++i) { drawRow(hex[i], blue) } // close current table document.write('</TABLE>') }// draw all cube panels inside table cellsfunction drawCube() { // open table document.write('<TABLE CELLPADDING=5 CELLSPACING=0 BORDER=1><TR>') // loop through all non-dithered color descripters as blue hex for (var i = 0; i < 6; ++i) { // open table cell with white background color document.write('<TD BGCOLOR="#FFFFFF">') // call function to create cube panel with hex[i] blue hex drawTable(hex[i]) // close current table cell document.write('</TD>') } // close table row and table document.write('</TR></TABLE>')}// call function to begin executiondrawCube()// --> </SCRIPT>
说明：方便你选取同一色阶的色彩，很实用！