(aka: color picker, colorpicker, colourpicker, colour selector and colorselector)
Most types of information are handled well by input fields, textareas, dropdown menus and checkboxes. But selecting a colour isn't one of them. This widget allows one to easily add colour selection to a form.
Installation is easy. Just download cp.js (6KB) and cp.css,
then add them to your page:
<script src="cp.js"></script>
<link rel="stylesheet" href="cp.css">
Place normal input boxes in your form wherever you want colours:
<input name="mycolour" id="mycolour" value="ff00ff">
Follow this by a line of JavaScript which will convert the input boxes into colour pickers:
<script>
cp_init('mycolour');
</script>
Change events are executed on the input field whenever the colour changes.
The selection of colours may be changed by editing or overriding the global 'cp_grid' 2D array.
A colour of '' represents no colour.
The colour value must be a six-character hex code (e.g. '0088ff'). Other formats will not work (e.g. 'green', '#0088ff', '08f').
This is a paletted selection tool, designed for average users. If you want an infinite number of colours for professional users, then separate RGB scrollbars might be better.