Javascrict, OnChange event alter CSS element?

[spikypunker]

Hi dudes, i've implemeted a javascript tool that returns a HEX value from a color picker, it currently adds the value into an Input box. I really want to have the HEX value also get fired into a CSS rule?

 

Here's the code snippet that i've amended, it contains the event and the previous action which added the HEX to the input box, and also the line ive TRIED to add which i thought would change the CSS rule but yeah it's not working

 

Any ideas?? Cheers guys!!

 

 

'onChange': function(color) {
$('myInput').value = color.hex;
document.getElementById(bgcolor1).style.backgroundColor = color.hex;

 

Bear in mind this is part of a slightly larger function which i can paste too, but this is the snippet i wanted to add the change to!

 

Peace, Chris

Edit/Delete Message

[Ken2k7]

1. What's color in the parameter? Is it an object with hex as a member?

2. What does $('myInput') do?

3. What is bgcolor1 in the document.getElementById() line?

[F1Fan]

Try this:

'onChange': function(color) {
   $('myInput').value = '#'+color.hex;
   document.getElementById(bgcolor1).style.backgroundColor = '#'+color.hex;

[spikypunker]

I've solved this on me own guys, thanks the the help

 

Here's the code if anyones interested! Its part of the code from the tool MooRainbow, and what i've added changes a CSS class which then changes the background color of table cells with that class, in realtime. Pretty cool if i do say so myself.

 

<script type="text/javascript">
window.addEvent('domready', function() {
var r = new MooRainbow('myRainbow', {
	'startColor': [58, 142, 246],
	'onChange': function(color) {
		$('myInput').value = color.hex;


						var css = document.styleSheets[0];
							try { // IE
    									css.addRule('.bgcolor1', 'background-color:' + color.hex + ';');
    								}
						catch(e) { // W3C
    							css.insertRule('.bgcolor1 {background-color:' + color.hex + ';}',css.cssRules.length);
   								 }

	}
});
});
</script>