<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Color Picker</title>
<style type="text/css">
<!--
body {
font-size: 12px;
padding: 10px;
margin: 0;
}
#selectedColor {
border: 1px solid #000000;
width: 40px;
height: 13px;
margin-bottom: 5px;
}
#colorValue {
border: 0;
width: 60px;
height: 13px;
margin-bottom: 5px;
}
#box {
display: block;
width: 180px;
}
#colors {
display: inline;
width: 180px;
padding: 0;
margin: 0;
list-style: url(none) none;
}
li.colorS {
width: 60px;
height: 60px;
display: block;
float: left
}
ul.colorSquare {
display: inline;
width: 60px;
padding: 0;
margin: 0;
list-style: url(none) none;
}
li.color {
line-height: 10px;
width: 10px;
height: 10px;
display: block;
float: left;
cursor: default;
}
-->
</style>
<script type="text/javascript">
<!--
function pickColor(sColor, i) {
if (i == 0) {
document.getElementById("colorValue").value = "#" + sColor;
document.getElementById("selectedColor").style.background = "#" + sColor;
}
else if (i == 1) {
document.getElementById("colorValue").value = "#" + sColor;
if (opener) {
opener.document.getElementById('dbgcolor1').value = "#" + sColor;
opener.changeColor1(opener.document.getElementById('dbgcolor1'));
window.close();
}
else {
window.close();
}
}
}
//-->
</script>
</head>
<body>
<div>
<input name="selectedColor" type="text" id="selectedColor" />
<input name="colorValue" type="text" id="colorValue" value="" />
</div>
<div id="box"><ul id="colors">
<li class="colorS">
<ul class="colorSquare">
<li class="color" style="background: #000000" onmouseover="pickColor('000000', 0);" onclick="pickColor('000000', 1);"> </li>
<li class="color" style="background: #003300" onmouseover="pickColor('003300', 0);" onclick="pickColor('003300', 1);"> </li>
<li class="color" style="background: #006600" onmouseover="pickColor('006600', 0);" onclick="pickColor('006600', 1);"> </li>
<li class="color" style="background: #009900" onmouseover="pickColor('009900', 0);" onclick="pickColor('009900', 1);"> </li>
<li class="color" style="background: #00CC00" onmouseover="pickColor('00CC00', 0);" onclick="pickColor('00CC00', 1);"> </li>
<li class="color" style="background: #00FF00" onmouseover="pickColor('00FF00', 0);" onclick="pickColor('00FF00', 1);"> </li>
<li class="color" style="background: #000033" onmouseover="pickColor('000033', 0);" onclick="pickColor('000033', 1);"> </li>
<li class="color" style="background: #003333" onmouseover="pickColor('003333', 0);" onclick="pickColor('003333', 1);"> </li>
<li class="color" style="background: #006633" onmouseover="pickColor('006633', 0);" onclick="pickColor('006633', 1);"> </li>
<li class="color" style="background: #009933" onmouseover="pickColor('009933', 0);" onclick="pickColor('009933', 1);"> </li>
<li class="color" style="background: #00CC33" onmouseover="pickColor('00CC33', 0);" onclick="pickColor('00CC33', 1);"> </li>
<li class="color" style="background: #00FF33" onmouseover="pickColor('00FF33', 0);" onclick="pickColor('00FF33', 1);"> </li>
<li class="color" style="background: #000066" onmouseover="pickColor('000066', 0);" onclick="pickColor('000066', 1);"> </li>
<li class="color" style="background: #003366" onmouseover="pickColor('003366', 0);" onclick="pickColor('003366', 1);"> </li>
<li class="color" style="background: #006666" onmouseover="pickColor('006666', 0);" onclick="pickColor('006666', 1);"> </li>
<li class="color" style="background: #009966" onmouseover="pickColor('009966', 0);" onclick="pickColor('009966', 1);"> </li>
<li class="color" style="background: #00CC66" onmouseover="pickColor('00CC66', 0);" onclick="pickColor('00CC66', 1);"> </li>
<li class="color" style="background: #00FF66" onmouseover="pickColor('00FF66', 0);" onclick="pickColor('00FF66', 1);"> </li>
<li class="color" style="background: #000099" onmouseover="pickColor('000099', 0);" onclick="pickColor('000099', 1);"> </li>
<li class="color" style="background: #003399" onmouseover="pickColor('003399', 0);" onclick="pickColor('003399', 1);"> </li>
<li class="color" style="background: #006699" onmouseover="pickColor('006699', 0);" onclick="pickColor('006699', 1);"> </li>
<li class="color" style="background: #009999" onmouseover="pickColor('009999', 0);" onclick="pickColor('009999', 1);"> </li>
<li class="color" style="background: #00CC99" onmouseover="pickColor('00CC99', 0);" onclick="pickColor('00CC99', 1);"> </li>
<li class="color" style="background: #00FF99" onmouseover="pickColor('00FF99', 0);" onclick="pickColor('00FF99', 1);"> </li>
<li class="color" style="background: #0000CC" onmouseover="pickColor('0000CC', 0);" onclick="pickColor('0000CC', 1);"> </li>
<li class="color" style="background: #0033CC" onmouseover="pickColor('0033CC', 0);" onclick="pickColor('0033CC', 1);"> </li>
<li class="color" style="background: #0066CC" onmouseover="pickColor('0066CC', 0);" onclick="pickColor('0066CC', 1);"> </li>
<li class="color" style="background: #0099CC" onmouseover="pickColor('0099CC', 0);" onclick="pickColor('0099CC', 1);"> </li>
<li class="color" style="background: #00CCCC" onmouseover="pickColor('00CCCC', 0);" onclick="pickColor('00CCCC', 1);"> </li>
<li class="color" style="background: #00FFCC" onmouseover="pickColor('00FFCC', 0);" onclick="pickColor('00FFCC', 1);"> </li>
<li class="color" style="background: #0000FF" onmouseover="pickColor('0000FF', 0);" onclick="pickColor('0000FF', 1);"> </li>
<li class="color" style="background: #0033FF" onmouseover="pickColor('0033FF', 0);" onclick="pickColor('0033FF', 1);"> </li>
<li class="color" style="background: #0066FF" onmouseover="pickColor('0066FF', 0);" onclick="pickColor('0066FF', 1);"> </li>
<li class="color" style="background: #0099FF" onmouseover="pickColor('0099FF', 0);" onclick="pickColor('0099FF', 1);"> </li>
<li class="color" style="background: #00CCFF" onmouseover="pickColor('00CCFF', 0);" onclick="pickColor('00CCFF', 1);"> </li>
<li class="color" style="background: #00FFFF" onmouseover="pickColor('00FFFF', 0);" onclick="pickColor('00FFFF', 1);"> </li>
</ul>
</li>
<li class="colorS">
<ul class="colorSquare">
<li class="color" style="background: #330000" onmouseover="pickColor('330000', 0);" onclick="pickColor('330000', 1);"> </li>
<li class="color" style="background: #333300" onmouseover="pickColor('333300', 0);" onclick="pickColor('333300', 1);"> </li>
<li class="color" style="background: #336600" onmouseover="pickColor('336600', 0);" onclick="pickColor('336600', 1);"> </li>
<li class="color" style="background: #339900" onmouseover="pickColor('339900', 0);" onclick="pickColor('339900', 1);"> </li>
<li class="color" style="background: #33CC00" onmouseover="pickColor('33CC00', 0);" onclick="pickColor('33CC00', 1);"> </li>
<li class="color" style="background: #33FF00" onmouseover="pickColor('33FF00', 0);" onclick="pickColor('33FF00', 1);"> </li>
<li class="color" style="background: #330033" onmouseover="pickColor('330033', 0);" onclick="pickColor('330033', 1);"> </li>
<li class="color" style="background: #333333" onmouseover="pickColor('333333', 0);" onclick="pickColor('333333', 1);"> </li>