x10 Sophmore
Hello,
How can I change background color with JavaScript?
like this:
heres the head codeCode:<div onclick="change(green)">change bakcground color</div>
It will not work,, please help.Code:function change(){ document.getElementById('uptd2').style.backgroundColor=(); }
Community Advocate
1. Do you actually have an element with id="uptd2"?
2. Your function does not accept any arguments.
You should have done it like this:
* changes are in redCode:<div id="uptd2" onclick="change('green')">change background color</div> .... function change(color){ document.getElementById('uptd2').style.backgroundColor = color; }
Last edited by farscapeone; 09-05-2010 at 08:31 AM.
x10 Sophmore
Well... it did only work if I had the id on the div tag....
Here is the code who di not work for me:
It is the table data (td) who shall change background color, not the div...Code:<div onclick="change('yellow')">change background color</div> <table> <tr> <td id="uptd2"> .... function change(color){ document.getElementById('uptd2').style.backgroundColor = color; }
Last edited by gaptrast; 09-05-2010 at 11:02 AM.
not alex mac
If you're doing stuff like this, I would recommend looking into jQuery
~Callum
I can customise your phpBB board. Send me a PM.
lynxphp - info, tutorials and scripts
"A forum post should be like a skirt; long enough to cover the subject but short enough to keep things interesting."
Community Advocate
A 50KB download to change a background colour on a table cell? That's a bit severe, isn't it?
Is the id "uptd2" unique on the web page? Are you using any sort of debugging aid, like Firebug or even a JavaScript error console, when developing? (And if not, why not?)
“Beware of bugs in the above code; I have only proved it correct, not tried it.” --Donald Knuth
"It was as if its architects were given a perfectly good hammer and gleefully replied, 'neat! With this hammer, we can build a tool that can pound in nails.'" -- Alex Papadimoulis (on TheDailyWTF.com)
x10Hosting Member
Hi,
This example will change the td background color when you click on the div.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="da" lang="da" >
<head>
<style type="text/css">
#changeColorDiv
{
width: 200px;
height: 200px;
color: white;
background-color: grey;
}
#uptd2
{
width: 200px;
height: 200px;
color: white;
background-color: grey;
}
</style>
<script type="text/javascript">
function change(color)
{
document.getElementById('uptd2').style.backgroundC olor=(color);
}
</script>
</head>
<body>
<table>
<tr>
<td id="uptd2"></td>
</tr>
</table>
<div id="changeColorDiv" onclick="change('green');">click to change bakcground color</div>
</body>
</html>
not alex mac
If you link to the jQuery document hosted on google, it's usually already cached by the user, as there are a LOT of sites that link to it.Originally Posted by essellar
~Callum
I can customise your phpBB board. Send me a PM.
lynxphp - info, tutorials and scripts
"A forum post should be like a skirt; long enough to cover the subject but short enough to keep things interesting."
Community Advocate
I agree with Alex Mac, jQuery rocks!!! ... and it's totally worth it. Please stop with that 50KB nonsense. Nobody uses JavaScript just to change the background color of one element. At the end the amount of JavasScript code almost always exceeds the size of jQuery library and code combined.
Community Advocate
even if it WAS 50kb, do you really have that much of a crappy down speed that it would take you long to download it? It would literally take me ~2 seconds here..
█ Neil Hanlon | x10Hosting Support Representative
█ Neil[at]x10hosting.com
█ I'm always happy to help. Just ask a question in Free Hosting
█ Terms of Service IRC
x10Hosting Member
The changes process is ;
Code:<div onclick="change(green)">change bakcground color</div>
heres the head code
Code:
function change(){document.getElementById('uptd2').style.ba ckgroundColor=();
}It will not work,, please help.
_______________________________________
Malaysia Vacations
Malaysia Holiday
Posting Permissions
LinkBack URL
About LinkBacks
Reply With Quote
