jQuery Hex Colorpicker
##What? A simple color picker that allows discrete (as opposed to analog) RGB hex color values to be visually selected and entered into a designated input field.
##How? Simple!
Include jQuery as well as the javascript and stylesheet files:
1 <script src="/pathto/jquery-hex-colorpicker.js"></script>
2 <link rel="stylesheet" href="/pathto/jquery-hex-colorpicker.css" />Then, all you have to do is attach the hexColorPicker function to any input:
1 $('#myinputid').hexColorPicker();You can also add options to customize to your needs:
1 jQuery(".color-picker").hexColorPicker({
2 "container":"dialog",
3 "colorModel":"hsv",
4 "pickerWidth":300,
5 "size":7,
6 "style":"hex",
7 });#jQuery Hex Picker Demo
Demo 1:
jquery-hex-colorpicker default implementation
1 jQuery("#color-picker1").hexColorPicker();Demo 2:
jquery-hex-colorpicker using the jquery-ui "dialog" container. Note: jQuery UI must be included for this option to work. Also, the function is applied to two inputs with the same class.
1 jQuery(".color-picker").hexColorPicker({
2 "container":"dialog",
3 });Demo 3:
jquery-hex-colorpicker using the HSL color map, also adjusting the number of boxes, size of picker, and using the "box" style.
1 jQuery("#color-picker2").hexColorPicker({
2 "container":"dialog",
3 "colorModel":"hsl",
4 "pickerWidth":400,
5 "size":15,
6 "style":"box",
7 });##More Information
For more information on how to setup a rules and customizations, check the documentation.
License
Copyright (c) 2014 Boone Putney Licensed under the MIT license. Submit a bug report above or here: