deprecated-addons/dav/colorpicker/README.md

91 lines
2.6 KiB
Markdown
Raw Permalink Normal View History

## Really Simple Color Picker
This is a very minimal, yet robust Color Picker based on jQuery.
For more details check the introductory blog post - http://laktek.com/2008/10/27/really-simple-color-picker-in-jquery/
### Usage
You can either clone [this repo](https://github.com/laktek/really-simple-color-picker) or download the latest build as a zip from here - http://github.com/laktek/really-simple-color-picker/zipball/master
Color Picker requires jQuery 1.2.6 or higher. Make sure to load it before Color Picker (there's no other dependencies!).
For default styles of the color picker load the CSS file that comes with the addon.
```html
<script language="javascript" type="text/javascript" src=jquery.min.js"></script>
<script language="javascript" type="text/javascript" src="jquery.colorPicker.min.js"/></script>
<link rel="stylesheet" href="colorPicker.css" type="text/css" />
```
Add a text field to take the color input.
```html
<div><label for="color1">Color 1</label> <input id="color1" type="text" name="color1" value="#333399" /></div>
```
Then call 'colorPicker' method on the text field when document loads.
```html
<script language="javascript">
jQuery(document).ready(function($) {
$('#color1').colorPicker();
}
</script>
```
### Options
There are several options you can set at the time of binding.
**Selected color**
Color Picker will use the value of the input field, which the picker is attached to as the selected color. If not, it will use the color passed with `pickerDefault` property.
```javascript
$('#color1').colorPicker({pickerDefault: "ffffff"});
```
**Color Palette**
Overrides the default color palette by passing an array of color values.
```javascript
$('#color1').colorPicker({colors: ["333333", "111111"]});
```
**Transparency**
Enable transparency value as an option.
```javascript
$('#color1').colorPicker({transparency: true});
```
If you want to set an option gloablly (to apply for all color pickers), use:
```javascript
$.fn.colorPicker.defaults.colors = ['151337', '111111']
```
### Demo
Demo can be found at http://laktek.github.com/really-simple-color-picker/demo.html
### Real-world Examples
* [CurdBee](http://demo.curdbee.com/settings/branding)
* [Readability](https://www.readability.com/publishers/tools)
Let us know how you are using Really Simple Color Picker...
### Contributors
* Lakshan Perera - http://laktek.com
* Daniel Lacy - http://daniellacy.com
### Issues & Suggestions
Please report any bugs or feature requests here:
https://github.com/laktek/really-simple-color-picker/issues