dojox.widget.ColorPicker

Project owner:Nathan Toone
since:V1.1

A Photoshop-like HSV ColorPicker widget.

Introduction

This ColorPicker adds many options to the standard ColorPalette available in Dijit.

Usage

To use the ColorPicker you need to first load the CSS:

<link rel="stylesheet" href="dojox/widget/ColorPicker/ColorPicker.css" />

And Require the module:

dojo.require("dojox.widget.ColorPicker");

Examples

Programmatic example

<link rel="stylesheet" href="{{baseUrl}}dojox/widget/ColorPicker/ColorPicker.css" />

dojo.require("dojox.widget.ColorPicker");
dojo.ready(function(){
    var c = new dojox.widget.ColorPicker({}, "picker1");
});

<div id="picker1"></div>

Declarative example

<link rel="stylesheet" href="{{baseUrl}}dojox/widget/ColorPicker/ColorPicker.css" />

dojo.require("dojox.widget.ColorPicker");

<div data-dojo-type="dojox.widget.ColorPicker" id="picker2"></div>

A ColorPicker within a DropDownButton

<link rel="stylesheet" href="{{baseUrl}}dojox/widget/ColorPicker/ColorPicker.css" />

dojo.require("dojox.widget.ColorPicker");
dojo.require("dijit.form.DropDownButton");

<div data-dojo-type="dijit.form.DropDownButton">
    <span>
        ColorPicker
    </span>
    <div data-dojo-type="dojox.widget.ColorPicker" id="picker3"></div>
</div>

Notes

NOTE: as of Dojo 1.2, The ColorPicker is experimental, and doesn't implement the dijit.set() and get() methods for getting and setting values.