|
||
|
HTML Color Chart with Background Color Input
This is an HTML color reference chart that displays 4096 colors
and gives you the option to choose a different background color.
It is also a good exercise in a triple "For...Next" loop and dynamic table generation.
Plus demonstrates the Hex() function in VBScript.
Here is the ASP code for this script:
<% BGColor = Request("BGColor") If Len(Trim(BGColor)) = 0 Then BGColor = "000000" End If Response.Write "<div style=" & chr(34) & _ "background-color:#" & BGColor & ";" & _ "padding-top:15px;" & chr(34) & ">" & chr(13) %> <form name="ChgColor" method="Post"> <table class="DataTble" align="center" style="background-color:#ffffff;"> <tr class="bnotes"> <td> Enter a new background-color: #<input type="text" name="BGColor" value="<%=BGColor%>" size="6" class="bnotes"> <input type="submit" value="Go" class="bnotes"> </tr> </table> </form> <% Function HexColor(TheNum) If TheNum = 256 Then HexColor = Hex(255) Else HexColor = Hex(TheNum) If Len(HexColor) < 2 Then HexColor = "0" & CStr(HexColor) End If End If End Function Response.Write "<table " & _ "align=" & chr(34) & "center" & chr(34) & " " & _ "cellspacing=" & chr(34) & "0" & chr(34) & " " & _ "cellpadding=" & chr(34) & "1" & chr(34) & " " & _ "style=" & chr(34) & "border-style:none;background-color:#" & _ BGColor & _ chr(34) & _ ">" & chr(13) Cells = 0 ColorCount = 0 For Red = 0 to 255 step 17 HRed = HexColor(Red) For Green = 0 to 255 step 17 HGreen = HexColor(Green) For Blue = 0 to 255 step 17 HBlue = HexColor(Blue) Cells = Cells + 1 ColorCount = ColorCount + 1 If Cells = 1 Then Response.Write "<tr style=" & chr(34) & _ "font-size:8pt;font-family:times;text-align:center;" & chr(34) & _ ">" & chr(13) End If Response.Write "<td " & _ "style=" & chr(34) & _ "border-style:inset;" & _ "border-width:2px;" & _ "padding:2px;" & _ "border-color:#" & HRed & HGreen & HBlue & ";" & chr(34) & " " & _ "title=" & chr(34) & HRed & HGreen & HBlue & chr(34) & ">" & chr(13) Response.Write "<div " & _ "style=" & chr(34) & _ "background-color:#" & HRed & HGreen & HBlue & ";" & chr(34) & ">" & _ " </div>" & chr(13) Response.Write "<div " & _ "style=" & chr(34) & _ "color:#" & HRed & HGreen & HBlue & ";" & _ "background-color:#" & BGColor & ";" & chr(34) & ">" & _ HRed & HGreen & HBlue & _ "</div>" & chr(13) Response.Write "<div " & _ "style=" & chr(34) & _ "background-color:#" & HRed & HGreen & HBlue & ";" & chr(34) & ">" & _ " </div>" & chr(13) Response.Write "</td>" & chr(13) If Cells = 12 Then Response.Write "</tr>" & chr(13) Cells = 0 End If Next Next Next Response.Write "</table>" & chr(13) Response.Write "</div>" & chr(13) %> |