Color Diver Home Page Color Picker
aka Diving Buddy
Make one! About Samples Contact
If you've been reading our help files, you already know that the ColorDiver widget can be placed in any HTML document with just the following line of Javascript code:

<script type="text/javascript"
src="http://colordiver.com/cdrjs.php?id=NNNN"></script>

This simple object allows the web page user to click anywhere in the specimen image and immediately view the color code for that position.

Advance users, however, may want more interaction than simple color selection. You may want to further process the chosen color to change other objects on the host page, or, as input to forms for further processing. ColorDiver Widget uses a second document script just for that purpose:

<script type="text/javascript">

 function catchdiver(hexc){
  // do something with hexc
  return [true/false] * see below
 }

</script>

To use the widget interactively, define a Javascript function with the name 'catchdiver' in your host document.

  • When a color is selected, the ColorDiver widget will check for the presence of this function and pass the selected color value.
  • Add javascript statements within this function to provide the user interaction desired.
  • The return value [true or false] determines the behavior of the color update. Return TRUE if you want the widget to 'hold' on the current color until the specimen is clicked again.
  • Return FALSE and the colors will continue to be updated as the mouse is moved over the object. (necessary if the user plans to copy/paste the code displayed by the widget)