|
|
|
|
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)
%>