<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Popup color picker</title>
<style type="text/css">
body{
font-family: Trebuchet MS, Lucida Sans Unicode, Arial, sans-serif;
width:100%;
height:100%;
margin:0px;
padding:0px;
background-image:url('http://www.dhtmlgoodies.com/images/heading3.gif');
background-repeat:no-repeat;
padding-top:85px;
overflow:hidden;
}
</style>
<link rel="stylesheet" href="js_color_picker_v2.css" media="screen">
<script src="color_functions.js"></script>
<script type="text/javascript" src="js_color_picker_v2.js"></script>
</head>
<body>
<form>
<h1>Example 1</h1>
<div style="width:103px;width/* */:/**/100px;width: /**/100px;height:20px;border:1px solid #7F9DB9;">
<input type="text" maxlength="7" style="width:80px;font-size:12px;height:17px;float:left;border:0px;padding-top:2px" name="rgb" size="10">
<img style="float:right;padding-right:1px;padding-top:1px" src="images/select_arrow.gif" onmouseover="this.src='images/select_arrow_over.gif'" onmouseout="this.src='images/select_arrow.gif'" onclick="showColorPicker(this,document.forms[0].rgb)">
</div>
<h2>Simpler example 2</h2>
<table>
<tr>
<td><input type="text" size="10" maxlength="7" name="rgb2"></td>
<td><input type="button" value="Color picker" onclick="showColorPicker(this,document.forms[0].rgb2)"></td>
</tr>
</table>
</form>
</body>
</html>