Log in

View Full Version : how to change text and background color same time


ultimate-tester
02-26-2008, 09:15 PM
Hi all,

I'm busy making a site with some cool effects.. This is a part of my code:



<form name="changeColor">
<p><font size="2" face="Verdana,Arial,Helvetica,Sans Serif">Kies een achtergrond kleur: <br> <br>
<input type="button" name="colr" value="ORANJE" onclick="document.bgColor='#FF9900'">
<br />
</font><font size="2" face="Verdana,Arial,Helvetica,Sans Serif">
<input type="button" name="colr" value="WIT" onclick="document.bgColor='#FFFFFF'">
<br />
</font><font size="2" face="Verdana,Arial,Helvetica,Sans Serif">
<input type="button" name="colr" value="ZWART" onclick="document.bgColor='#000000'">
</font> </p>
</form>


Now I want to change the TEXT color and BACKGROUND color. If you click ORANJE (orange), the text has to be black, if you press WIT (white), the text has to be also black, and if you press ZWART (black), the text has to be white. Now I know that the code for changing text color is

document.gfColor='#FFFFFF' but i don't know how to put that in the script, cause it doesn't work if I just place it behind the document.bgColor=blablabla

How do I put this in the code??

Thanks, Ultimate-Tester
thetestingsite
02-26-2008, 09:25 PM
onclick="document.bgColor='#000000'; document.gfColor='#FFFFFF'"

Hope this helps.
jscheuer1
02-27-2008, 01:55 AM
document.gfColor

Is nothing unless it has been previously defined. You would be better off working with standard css scripted style property/value pairs.


<span style="cursor:pointer;text-decoration:underline;"
onclick="document.body.style.backgroundColor='orange';
document.body.style.color='black';">Orange</span>

Demo:


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
body {
color:white;
background-color:green;
}
</style>
</head>
<body>
<span style="cursor:pointer;text-decoration:underline;"
onclick="document.body.style.backgroundColor='orange';
document.body.style.color='black';">Orange</span>
</body>
</html>
ultimate-tester
02-27-2008, 08:13 AM
Ok I try this.. Thanks for the help