2011-01-21 2 views
0

Привет всем, у меня есть это задание, где мне нужно интегрировать подборщик цветов в пользовательский интерфейс Yahoo на веб-сайт. Когда кто-то выбирает цвет, фон страницы должен стать таким цветом.Как использовать сортировщик Yahoo для изменения цвета фона

Я следовал инструкциям здесь http://developer.yahoo.com/yui/colorpicker/#events, но я не могу понять, как изменить цвет фона на выбранный цвет. Я могу изменить фон, когда кто-то выбирает цвет, однако я не знаю, как получить цвет, который выбран в качестве ввода/(см. Код для // комментария), до сих пор у меня есть:

в голове:

<!-- 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> 

ответ

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] + ");" 
Смежные вопросы