Widget カラーパレット (Color Palette)

 Dojoには、いくつかのWidget(ウィジェット)が用意されています。カラーパレットを表示するウィジェットも用意されています。カラーパレットは、以下のようにしてウィジェット名を指定すると自動的に作成されます。(実際のサンプルを実行する

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>dojoサンプル</title>
<script src="dojo.js" type="text/javascript"></script>
<script type="text/javascript"><!--
dojo.require("dojo.widget.ColorPalette");
// --></script>
</head>
<body>
<h1>dojoサンプル</h1>
<div dojoType="ColorPalette"></div>
</body>
</html>

 カラーパレットが表示されれば成功です。カラーパレット上でクリックされるとonColorSelectイベントが発生します。以下のサンプルはカラー部分をクリックするとページ上にカラーコードが表示されます。(サンプルを実行する

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>dojoサンプル</title>
<script src="dojo.js" type="text/javascript"></script>
<script type="text/javascript"><!--
dojo.require("dojo.widget.ColorPalette");
(dojo.widget.html.ColorPalette).prototype.onColorSelect = function(col) {
document.getElementById("result").innerHTML = col;
}

// --></script>
</head>
<body>
<h1>dojoサンプル</h1>
<div dojoType="ColorPalette"></div>
<div id="result"></div>
</body>
</html>


[目次へ]

(2006.3.30)