-
Include farbtastic.js in your HTML: <script type="text/javascript" src="farbtastic.js"></script> -
Add a placeholder div and a text field to your HTML, and give each an ID: -
Add a ready() handler to the document which initializes the color picker and link it to the text field with the following syntax: <script type="text/javascript"> $(document).ready(function() { $ ('#colorpicker').farbtastic('#color'); }); </script>
$(...).farbtastic() $(...).farbtastic(callback)
-
DOM Node, jQuery object or jQuery selector: the color picker will be linked to the selected element(s) by syncing the value (for form elements) and color (all elements). -
Function: this function will be called whenever the user chooses a different color.
$.farbtastic(placeholder) $.farbtastic(placeholder, callback)
$(...).farbtastic(options) $.farbtastic(placeholder, options)
-
callback: The callback as described previously. -
height: The height of the widget. -
width: The width of the widget.