簡單 RGB、HSB、十六進制顏色選取器 jQuery 插件
沒有圖像 ！只是 JS 和 CSS 文件
非常直觀類似 Photoshop 的界面
光明和黑暗很容易自定義 CSS3 外觀
28 KB 總由瀏覽器加載看起來不錯甚至在 IE7及工程非常容易實現
效果：
插件下載：http://www.jq22.com/jquery-info367
下載該插件和 colpick.js 和 colpick.css 添加到您的文檔的頭：
<script type="text/javascript" src="js/jquery-1.11.1.min.js" ></script>
<script src="js/colpick.js" type="text/javascript"></script>
<link rel="stylesheet" href="css/colpick.css" type="text/css"/>
Html：
<div class="color_shil">
<!--重要，不能刪除-->
<p id="picker">顏色選擇</p>
<input id="color" type="text" value="" placeholder="請選擇顏色"/>
</div>
js：
<script>
//顏色選擇器
$('#picker').colpick({
layout: 'hex',
submit: 0,
colorScheme: 'dark',
onChange: function(hsb, hex, rgb, el, bySetColor) {
//把顏色存進 id=color 的input里
$("#color").val("#"+hex);
//把邊框的顏色 變為選擇的顏色
$("#color").css({"border-color":"#"+hex+"","background":"#"+hex+""});
if(!bySetColor) $(el).val(hex);
}
}).keyup(function() {
$(this).colpickSetColor(this.value);
});
//顏色選擇器 end
//點擊按鈕 獲取到顏色
$(document).on("click","button",function(){
//獲取 id=color 的顏色
var color=$("#color").val();
alert(color)
});
//點擊按鈕 獲取到顏色
</script>
