0

こんにちは、私は Yahoo UI カラー ピッカーを Web サイトに統合する必要があるこの課題を抱えています。誰かが色を選択すると、ページの背景がその色になる必要があります。

http://developer.yahoo.com/yui/colorpicker/#eventsの指示に従いましたが、背景色を選択した色に変更する方法がわかりません。誰かが色を選んだときに背景を変更できますが、input/ として選択された色を取得する方法がわかりません (// コメントのコードを参照してください) 今まで私はこれを持っています:

頭の中で：

<!-- Dependencies --> 
<script src="http://yui.yahooapis.com/2.8.2r1/build/utilities/utilities.js" ></script>
<script src="http://yui.yahooapis.com/2.8.2r1/build/slider/slider-min.js" ></script>

  <!-- Color Picker source files for CSS and JavaScript -->
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.8.2r1/build/colorpicker/assets/skins/sam/colorpicker.css">
<script src="http://yui.yahooapis.com/2.8.2r1/build/colorpicker/colorpicker-min.js" ></script>

次に、ボディタグで： class="yui-skin-sam"

そして体内：

<div id="container"></div>
<script type="text/javascript">
var picker = new YAHOO.widget.ColorPicker("container", {
 showhsvcontrols: true,
 showhexcontrols: true,
 images: {
  PICKER_THUMB: "picker_thumb.png",
  HUE_THUMB: "hue_thumb.png"
 }
});

//a listener for logging RGB color changes;
//this will only be visible if logger is enabled:
var onRgbChange = function(o) {
 /*o is an object
  { newValue: (array of R, G, B values),
    prevValue: (array of R, G, B values),
    type: "rgbChange"
   }
 */
    // with this code i change the background when a color is picked, but not with the input col.
    // document.body.style.backgroundColor = 'green';
 YAHOO.log("The new color value is " + o.newValue, "info", "example");
}

//subscribe to the rgbChange event;
picker.on("rgbChange", onRgbChange);

  </script>
4

1 に答える 1

0

背景色を RGB 値 (o.newValue が与えるもの) に設定するための構文は次のようになります。 

doc.style.backgroundColor="rgb(239,239,239)";

...だから、次のようなことを試してください： 

document.body.style.backgroundColor = "rgb(" + o.newValue[0] + "," + o.newValue[1] + "," + o.newValue[2] + ");"
于 2011-01-22T02:42:19.763 に答える