PhotoShopライクなカラーピッカーjavascript「Photoshop-like JavaScript Color Picker」

カラピッカーの原型はPhotoShopによって作られた（？）
というわけで、今回はPhotoShopのように充実した機能をもつPhotoShop-like JavaScript Color Pickerを紹介します。

使用方法
PhotoColor.zipをダウンロードします。
<script type="text/javascript" src="http://yourdomian/prototype.js"></script>
<script type="text/javascript" src="http://yourdomian/colormethods.js"></script>
<script type="text/javascript" src="http://yourdomian/colorvaluepicker.js"></script>
<script type="text/javascript" src="http://yourdomian/slider.js"></script>
<script type="text/javascript" src="http://yourdomian/colorpicker.js"></script>
＊prototypeは1.6です。
次に以下のようなスクリプトを記入します。
<script type="text/javascript">
Event.observe(window,'load',function() {
cp1 = new Refresh.Web.ColorPicker('cp1', {startMode:'g', startHex:'ffcc00'});
});
</script>
メインとなる部分は長くなるので、zipファイルに同梱したindex.htmlかPhotoShopライクなカラーピッカーjavascript「Photoshop-like JavaScript Color Picker」サンプルページのソースをご覧下さい。

2007年10月28日

前の記事：accesskeyにも対応したツールチップ「NiceTitles」
次の記事：Movable Typeのコメントにタイトルをつけるプラグイン「MTCommentTitle」

関連記事

• [prototype]Proto.IPS
• [prototype]Tree.js
• [prototype]Slider
• JavaScriptライブラリの先駆け「prototype」を勉強しなおすサイト20
• [prototype]AjaxMGraph

• ファイルサイズをJavaScriptライブラリ「jQuery」で自動表示する「addSizes.js」
• JavaScriptライブラリ「jQuery」を使用してフォームを華麗に彩る「jqTransform」
• Webカラーに関するサイト21
• 英字新聞ぽいコラムをJavaScriptライブラリ「jQuery」で作る「Columnizer」
• 心地よく要素を切り替えるJavaScript「jFlip」
• CoverFlowを実現するJavaScript「JS Coverflow」
• 画像を丸く輝かせるJavaScript「sphere.js」
• セクシーなLightBoxを実現するJavaScript「Sexy LightBox」
• JavaScriptライブラリ「jQuery」を使ってカレンダーを作る「jCal.js」
• カバーフローぽい画像ギャラリーJavaScript「ProtoFlow」