XUL Programmer's Reference Manual

<colorpicker>

Attributes Common Children
id * * * 
type  
palettename  

<colorpicker> is a palette widget that can be used to select colors in a XUL application. The following sample shows the user of the colorpicker element and a function which returns the selected color:

<html:script>
  function doSomethingUseful(cp)
  {
    var color = cp.getAttribute('color');
    document.getElementById("input").value = color;
    document.getElementById("mydiv").style.backgroundColor = color;
  }
</html:script>

<colorpicker id="cp" onclick="doSomethingUseful(this);"/>
<html:p/>
<html:input id="input"/>
<html:p/>
<html:div id="mydiv" style="width:100px; height:100px; background-color:white"/>
 

<html:hr/>
 
 

The example above gets the color from the displayed palette, displays the value of the chosen color in the input field, and changes the background color of the html:div element "mydiv" to the chosen color.



 
type

Description

The type attribute specifies what kind of colorpicker is to be used.

Syntax

<colorpicker type="swatch" />

Example

<colorpicker type="swatch" />

Notes

This attribute does not need to be specified. Swatch is the only colorpicker type supported currently, and it is the default when this attribute is not explicit.
 
palettename

Description

palettename is na optional attribute for specifying what kind of palette to load into the colorpicker.

Syntax

<colorpicker palettename="gray | standard | web" />

Example

<colorpicker palettename="standard" />

Notes

The default value for the container attribute is "standard". "Web" is the 216 color palette, and "gray" is the grayscale palette.

 


 
 

Last updated: 13:10 1/26/00 Ian Oeschger