jQuery Plusin-farbtastic

在網頁上呈現顏色，必須要使用16進制數字的表示來代表各個顏色，這跟我們一般認知的紅色、黃色...等文字表示顏色有很大的不同，所以在photoshop有顏色選擇器可以讓使用者用是決選出自己喜歡的顏色，而如果想要在網頁上也有一樣的效果，就可以使用farbtastic這個外掛。

先從上面的網址去下載外掛，然後依規則使用外掛，就可以達成效果了。

首先把外掛跟css引入，記得圖片也要放上去同一個資料夾。
<script src="farbtastic.js" type="text/javascript">
</script>
<link href="farbtastic.css" rel="stylesheet" type="text/css"></link>
然後依下面的規則建立元件。
<form><input type="text" id="color" name="color" value="#123456" /></form>
<div id="colorpicker"></div>

最後再在jquery裡把外掛指定給特定元素。
<script type="text/javascript">
$(document).ready(function() {
$('#colorpicker').farbtastic('#color');
});
</script>
然後就可以很簡單的使用這個外掛了，更詳細的說明可以到官網去看看。

範例