[jquery]弧を描きながら現れるカラーピッカー[plagin]

こんばんわ。

とりあえず、jqueryのplaginを作ってみたかったので、作ってみた感じ・・・

とりあえずどんなものか見てみるには、下記、角丸の四角枠内をクリック
そうすると、カラーが弧を描いて表示されます。
で、そのカラーの中から1つクリックすると、その色の明るい色から暗い色のグラデーションが弧を描いて表示されます。またその現れた円をクリックすると、角丸の四角にクリックした色が設定されます。


書き方

<script type="text/javascript" src="jquery.circleColorPicer.js"></script>
<script type="text/javascript">
$(function(){
	$(".view").circleColorPicer({
		hsv : true,
		hsvNum : 8,
		'width' : 20+"px",
		'height' : 20+"px",
		hsvColor : '#FF0000',
		radius : 30,
		item2Num : 10,
		borderRadius: 30,
		'angleOffset' : -90.0,
		selectColor : function(color){
			$(this).css({"background-color": color});
		}
	});
});
</script>
<div>
    <div class="view"></div>
    <div class="view"></div>
    <div class="view"></div>
    <div class="view"></div>
    <div class="view"></div>
</div>

眠たくなってきたので、説明を書くのが面倒に・・・

とりあえず、そのplugin
jquery.circleColorPicer

スポンサーリンク

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です