gerkintrigg Posted January 13, 2010 Share Posted January 13, 2010 Hi! I'm writing a script to change the background colour of a div tag (for a colour picker found at http://www.myointernational.com/shine/testy.php but I'm having problems with dynamically passing the colour information to the div. Currently it works fine when I put my mouse over the top-left box, the div bg colour turns green but this is because of this code: <script language=javascript type="text/javascript"> function set_colours() { var myElement = document.getElementById("mhbcc"); myElement.style.backgroundColor="green"; } </script> Repeating that code loads of times will get BIG (especially as I have to call the script 5 times too). I was wondering how to get this code to work so that I can call the function like this: set_colours(#00FF00); I have tried changing the function but it doesn't seem to like me. Any tips? I'm much more familiar with PHP than Javascript... Link to comment https://forums.phpfreaks.com/topic/188320-changing-element-backgrounds/ Share on other sites More sharing options...
salathe Posted January 13, 2010 Share Posted January 13, 2010 I have tried changing the function but it doesn't seem to like me. Show us what you've tried and we can go from there. Link to comment https://forums.phpfreaks.com/topic/188320-changing-element-backgrounds/#findComment-994191 Share on other sites More sharing options...
gerkintrigg Posted January 13, 2010 Author Share Posted January 13, 2010 I tried: function set_colours(myColour) { var myElement = document.getElementById("mhbcc"); myElement.style.backgroundColor= myColour; } </script> the called by: onmouseover=set_colours(#FFFFFF) Link to comment https://forums.phpfreaks.com/topic/188320-changing-element-backgrounds/#findComment-994378 Share on other sites More sharing options...
KevinM1 Posted January 13, 2010 Share Posted January 13, 2010 I tried: function set_colours(myColour) { var myElement = document.getElementById("mhbcc"); myElement.style.backgroundColor= myColour; } </script> the called by: onmouseover=set_colours(#FFFFFF) Remember that color codes are strings. Put quotes around them (onmouseover=set_colours("#FFFFFF")). Link to comment https://forums.phpfreaks.com/topic/188320-changing-element-backgrounds/#findComment-994454 Share on other sites More sharing options...
gerkintrigg Posted January 14, 2010 Author Share Posted January 14, 2010 Perfect, this works: <html> <head> <title>test</title> <script language=javascript type="text/javascript"> function set_colours(myColour) { var myElement = document.getElementById("mhbcc"); myElement.style.backgroundColor=myColour; } </script> </head> <body> <form action="" name="orderForm"> <div id="mhbcc" style="height:50px; width:50px;"></div> <img src="furniture/white_label_colours.jpg" alt="colour picker" width="191" height="121" border="0" usemap="#Map"> <map name="Map"> <area shape="rect" coords="1,1,11,11" href="#" onMouseOver=set_colours("#FF00FF")> </map> </form> </body> </html> Thanks for that. It seems logical, but I just didn't think of it. (must have been late). Cheers! Link to comment https://forums.phpfreaks.com/topic/188320-changing-element-backgrounds/#findComment-994749 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.