ソース掲示板




すべてから検索

キーワード   条件 表示 現行ログ 過去ログ トピックス 名前 本文

  メンテナンス 前画面に戻る

対象スレッド 件名: jQuery カラーピッカー : colorpicker を カスタムタグで常に表示
名前: lightbox
処理選択
パスワード

件名 jQuery カラーピッカー : colorpicker を カスタムタグで常に表示
名前 lightbox
コメント
@HTML
<link rel="stylesheet" href="http://lightbox.in.coocan.jp/colorpicker/css/colorpicker.css" type="text/css" /><script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script><script type="text/javascript" src="http://lightbox.in.coocan.jp/colorpicker/colorpicker.js"></script><colorpicker></colorpicker><script type="text/javascript">
$('colorpicker').ColorPicker({
	flat: true,
	onSubmit: function(hsb, hex, rgb, el) {
		// 要素名は "COLORPICKER" になります
		console.log(el.tagName);
		// hex は文字列の16進文字列
		console.log(parseInt("0x"+hex));
		// オブジェクト
		console.dir(rgb);
		// オブジェクト
		console.dir(hsb);
		// エレメントより jQuery オブジェクトで id セット
		$(el).attr("id","target");
		// 正当 DOM 参照と el は一致
		if ( document.getElementById("target") == el ) {
			console.log("element");
		}
	}
});
</script>
@HEND

@DIV
<link rel="stylesheet" href="http://lightbox.in.coocan.jp/colorpicker/css/colorpicker.css" type="text/css" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="http://lightbox.in.coocan.jp/colorpicker/colorpicker.js"></script>

<colorpicker></colorpicker>

<script type="text/javascript">
$('colorpicker').ColorPicker({
	flat: true,
	onSubmit: function(hsb, hex, rgb, el) {
		// 要素名は "COLORPICKER" になります
		console.log(el.tagName);
		// hex は文字列の16進文字列
		console.log(parseInt("0x"+hex));
		// オブジェクト
		console.dir(rgb);
		// オブジェクト
		console.dir(hsb);
		// エレメントより jQuery オブジェクトで id セット
		$(el).attr("id","target");
		// 正当 DOM 参照と el は一致
		if ( document.getElementById("target") == el ) {
			console.log("element");
		}
	}
});
</script>
@END