JS Tutorial
Download
Demo
- Overview
- Documents
User Rating: 0/5 ( 0 votes)
Your Rating:
AntColorPicker is a jQuery color picker plug-in of AntProduction.
Source: antproduction.free.fr
1. INCLUDE CSS AND JS FILES
<link href="../public/css/AntColorPicker.css" rel="stylesheet"> <script type="text/javascript" src="../public/js/libs/external-libs/jquery-1.10.1.min.js"></script> <script type="text/javascript" src="../public/js/libs/external-libs/jquery-ui-1.10.4.min.js"></script> <script type="text/javascript" src="../public/js/libs/AntColorPicker.js"></script>
2. HTML
<input id="colorPicker" />
3. JAVASCRIPT
//initialisation of AntColorPicker with customisation of labels
$("#colorPicker").AntColorPicker(
//Custom parameters
{
"labelClose":"Close color picker",
"labelRAZColor":"Clear field"
}
);
4. OPTIONS
| Fields | Description |
|---|---|
| iconPath [string] | The relative path of directory of icons |
| withRAZOption [boolean] | Option. If "withRAZOption" is true, an icon to clear input field is add to DOM |
| labelClose [string] | Label of tooltip for close icon |
| labelRAZColor [string] | Label of tooltip for RAZ icon |
| zIndex [integer] | Integer to define the z-index of the div of the AntColorPicker |
| largeurPalette [integer] | Integer to define the width of the div of the AntColorPicker |
| contentTemplate [optional template html] | |
| contentLineTemplate [optional template html] |
The template Html to display colored boxes. It contain tag which will be replaced to insert colors. The template of tag is as follow : #tag#.
example based on color :
<li>
<a name="#color#" rel="#color#" style="background:#color#;" title="#color#"></a>
</li>
|
| builder [optional JavaScript anonymous function] | The default function to build the html content of the Antcolorpicker based on contentTemplate and contentLineTemplate parameters. Contained tags from templates are replaced with it. |
