bigcolorpicker拾色器原版本使用说明：
HTML
页面中首先在head中需要引入jquery库和bigcolorpicker插件，以及所需的样式jquery.bigcolorpicker.css。
<link rel="stylesheet" type="text/css" href="css/jquery.bigcolorpicker.css"/><script type="text/javascript" src="js/jquery.min.js"></script><script type="text/javascript" src="js/jquery.bigcolorpicker.min.js"></script>
接着，我们直接在body中放置一个用于触发接收颜色值的input输入框。
<input type="text" id="c1"/>
或者也可以直接放置一个html元素或者按钮。
<a href="javascript:void(0)" id="img"></a>
jQuery
调用bigcolorpicker插件非常简单，直接使用$(element).bigColorpicker(callback,engine,sideLength);
其中callback为回调函数，它可以把选择的颜色设置到绑bigColorpicker的元素的上，也可以自定义函数。engine可以为空，P、L，使用默认P，P代表着拾取器的背景是一张图片，而L则代表着拾取器的小格子是由一个个的li组成。sideLength参数是指小格子的个数，只有engine为L时生效，范围：2-10，默认为6。
$(function(){//点击输入框选取颜色 $("#c1").bigColorpicker("c1"); //点击选色按钮选取颜色 $("#btn").bigColorpicker("c2"); //点击方框选取颜色 $("#img").bigColorpicker(function(el,color){$(el).css("background-color",color); }); //选取多个颜色 $(".ku").bigColorpicker(function(el,color){$(el).css("background-color",color); }); //自定义颜色块个数 $("#c5").bigColorpicker("c5","L",3); });
bigcolorpicker拾色器/颜色选择器扩展版使用说明：
扩展版特点：
1)支持直接展示拾色器面板，原版本只支持点击才弹出拾色器面板
2)支持返回RGB颜色对象，原版本只支持返回hex颜色代码（在回调函数增加了rgb参数）
使用：
$(element).bigColorpicker(callback,engine,sideLength,alwaysShow);
其中，前三个参数是原版本插件的参数，alwaysShow是扩展的参数，默认false，若要直接展示拾色面板，改为true。
jQuery
$(".ku").bigColorpicker(function(el,hex,rgb){console.log(rgb.r+','+rgb.g+','+rgb.b);// 输出rgb颜色代码},'L', 10, true);
扩展版请到此网站下载：在线颜色选择器
