カラーピッカーは、古くなっているものが多く、開発ツールのコーンソールを見ると動くんですけれどエラーを発生しているものもあります。
この「JSColor」は、現時点でそういったエラーは発生していないです。
JSColorの特徴
例えばテキストボックスをクリックすると、下の画像にあるカラーピッカーが表示され、そこから色を選択するとテキストボックスにカラーコードが挿入されるシンプルな仕様になっています。
また、JavaScriptなどプログラムを書かずに表示することができます。
JSColorの設定方法
JSColorサイトからファイルをダウンロードします。
ダウンロードサイト:JSColor
適当な場所で解凍したあと、作成されたフォルダを任意の場所に配置したあと、script要素のsrcにjscolor.jsファイルまでのパスを設定します。
<script src="jscolor/jscolor.js"></script>
次に、カラーピッカーを表示するためのタグをhtmlに挿入すると表示されるようになります。。下のコードはシンプルなコードですが、value=”#aaaaaa”など初期値として値を設定できます。
<input type="text" class="color" />
スポンサーリンク
コメント