カラーピッカーを表示するJavaScriptライブラリはjQueryでもいくつかありますが、今回紹介する「JSColor」は軽量で簡単に実装可能です。

ダウンロード先

下記サイトへアクセスし、「jscolor-1.4.2.zip」リンクをクリックして「JSColor」をダウンロードします。
JSColorダウンロードサイト

使用方法

HTML

ダウンロードしたjs、画像ファイルなどを配置してJavaScriptファイル「jscolor.js」を読み込んで
input要素のクラスセレクタへ「color」と指定すれば設置完了です。

XHTML

<script type="text/javascript" src="jscolor.js"></script> <input class="color">

1 2 3

<script type="text/javascript" src="jscolor.js"></script>   <input class="color">

サンプル