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... Quote 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. Quote 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) Quote 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")). Quote 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! Quote Link to comment https://forums.phpfreaks.com/topic/188320-changing-element-backgrounds/#findComment-994749 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.