Simple Color Picker Plugin - colorselector

File Size: Unknown
Views Total: 2292
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Simple Color Picker Plugin - colorselector

colorselector is a simple and fast jquery plugin allows you to quickly pick a color form a set of predefined colors.

How to use it:

1.  Include jQuery Library and colorselector.js

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.colorbox.min.js"></script>

2. Predefine colors

<script type="text/javascript">
jQuery(document).ready(function($){

$("#big-selector").colorbox({
labels: [
'Black', 'Brown', 'Cardinal', 'Columbia', 'DkGreen', 'Gold', 'Gray', 
'Kelly', 'Maroon', 'Navy', 'Orange', 'Pink', 'Purple', 'Red', 'Royal', 'White'
],
colors: [
'000000', '502800', '500000', '1F2264', '003200', '646400', '4B4B4B', '005000', 
'320000', '000032', '643C00', '642864', '330032', '640000', '000064', 'fdfdfd'
],
width: 50,
height: 50,
top: 0,
left: 0,
perLine: 4,
onSelect: function($selected, color, index, label){
$("#RosterAwayJersey").val(index);
}
});

$("#big-selector").colorbox('setColorIndex', 1);
});
</script>

3. Markup

<div id="big-selector"></div>

This awesome jQuery plugin is developed by stdevteam. For more Advanced Usages, please check the demo page or visit the official website.