dav/colorpicker/README.md

   1 ## Really Simple Color Picker
   2
   3 This is a very minimal, yet robust Color Picker based on jQuery.
   4
   5 For more details check the introductory blog post - http://laktek.com/2008/10/27/really-simple-color-picker-in-jquery/
   6
   7 ### Usage
   8
   9 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
  10
  11 Color Picker requires jQuery 1.2.6 or higher. Make sure to load it before Color Picker (there's no other dependencies!).
  12 For default styles of the color picker load the CSS file that comes with the plugin.
  13
  14   ```html
  15     <script language="javascript" type="text/javascript" src=jquery.min.js"></script>
  16     <script language="javascript" type="text/javascript" src="jquery.colorPicker.min.js"/></script>
  17
  18     <link rel="stylesheet" href="colorPicker.css" type="text/css" />
  19   ```
  20
  21 Add a text field to take the color input.
  22
  23   ```html
  24     <div><label for="color1">Color 1</label> <input id="color1" type="text" name="color1" value="#333399" /></div>
  25   ```
  26
  27 Then call 'colorPicker' method on the text field when document loads.
  28
  29   ```html
  30     <script language="javascript">
  31       jQuery(document).ready(function($) {
  32         $('#color1').colorPicker();
  33       }
  34     </script>
  35   ```
  36
  37 ### Options
  38
  39 There are several options you can set at the time of binding.
  40
  41 **Selected color**
  42
  43 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.
  44
  45   ```javascript
  46     $('#color1').colorPicker({pickerDefault: "ffffff"});
  47   ```
  48
  49 **Color Palette**
  50
  51 Overrides the default color palette by passing an array of color values.
  52
  53   ```javascript
  54     $('#color1').colorPicker({colors: ["333333", "111111"]});
  55   ```
  56
  57 **Transparency**
  58
  59 Enable transparency value as an option.
  60
  61   ```javascript
  62     $('#color1').colorPicker({transparency: true});
  63   ```
  64
  65 If you want to set an option gloablly (to apply for all color pickers), use:
  66
  67   ```javascript
  68     $.fn.colorPicker.defaults.colors = ['151337', '111111']
  69   ```
  70 ### Demo
  71
  72 Demo can be found at http://laktek.github.com/really-simple-color-picker/demo.html
  73
  74 ### Real-world Examples
  75
  76 * [CurdBee](http://demo.curdbee.com/settings/branding)
  77 * [Readability](https://www.readability.com/publishers/tools)
  78
  79 Let us know how you are using Really Simple Color Picker...
  80
  81 ### Contributors
  82
  83 * Lakshan Perera - http://laktek.com
  84 * Daniel Lacy  - http://daniellacy.com
  85
  86 ### Issues & Suggestions
  87
  88 Please report any bugs or feature requests here:
  89 https://github.com/laktek/really-simple-color-picker/issues
  90