change color of text with javascript

gerble1000

01-15-2012, 02:15 PM

here is my problem
i need to set the color of a text here is what i need to change

<div style="position:absolute; left:10px; top:100px; width:250px; text-align:center;">

<font color="lightgreen" size="6"><b>* Mileage *</b></font><b>
<font color="black" size="6"><div id="bullet4">Not Specified</div></font><br></b>

<font color="lightgreen" size="6"><b>* Gearbox *</b></font><b>
<font color="black" size="6"><div id="bullet5">Not Specified</div></font><br></b>

<font color="lightgreen" size="6"><b>* Engine size *</b></font><b>
<font color="black" size="6"><div id="bullet6">Not Specified</div></font><br></b>

<font color="lightgreen" size="6"><b>* Body style *</b></font><b>
<font color="black" size="6"><div id="bullet7">Not Specified</div></font><br></b>

</div>

now i need to set the color from a text file server side
so far i can set the contents of the div serverside but the customer needs to be able to change the color of the innerhtml .
now i would like to store the color in a text file color.txt i can make the code to change the txt file myself
inside the color.txt would be "lightgreen" or other color
how would i go about this.
so in basic terms i need to set the color of the text from a color.txt file sat next to the index.html :)

Old Pedant

01-16-2012, 01:04 AM

First question: How will you *create* that color.txt file?

If you are going to allow the web user to choose colors, for example, then you will need some server-side processing to store the data. And if that is so, then why not use server-side processing to serve up the page with the colors from color.txt already in place?

gerble1000

01-16-2012, 08:48 AM

i have made a perl script to make the color.txt file.
i have put to much into this to change everything now.
i just need to figure out how to do this bit.......any ideas

gerble1000

01-16-2012, 08:53 AM

also the parts where it says "not specified" i already have a jquery script to change the innerhtml with a remot text file.
so getting the color.txt into a javascript variable i can do.
just need a way of changing the color. like this

var newcolor = "yellow";
document.bullet4.fontcolor.value = newcolor;

i know this wont work but i need something like this if its possible.

VIPStephan

01-16-2012, 10:28 AM

For one, you are using invalid HTML. The font element has been deprecated for at least 10 years now and should not be used. And even though the b element has always been “valid” I still find it bad practice, even though they’ve imposed a semantic meaning on it in HTML 5 now. What you want can all be done with CSS and separation of style and content (http://www.alistapart.com/articles/behavioralseparation). You’d add a class for each state you have and use that class as CSS selector to style the element. Then you change the className with JavaScript and there you go.

gerble1000

01-18-2012, 04:28 PM

could anyone give me an example to work with please..

Philip M

01-18-2012, 04:45 PM

Here you are ....

<html>
<head>

<style type = "text/css">
.myclassred {color:red}
.myclassgreen {color:green}
</style>

</head>

<body>

<input type = "text" id = "mytextbox" value = "Some Data Here" class = "myclassred">
<input type = "button" value = "Click to change text color" onclick = "changeit()">

<script type = "text/javascript">
function changeit() {
var val = document.getElementById("mytextbox").className;
if (val == "myclassred") {val = "myclassgreen"}
else {val = "myclassred"}
document.getElementById("mytextbox").className = val;

}
</script>

</body>
</html>

You could replace the if...else statements with:-

val == "myclassred" ? val = "myclassgreen" : val = "myclassred";

Obviously you could use the id of a <span> or <div> rather than a textbox.

"Often the football piches look barren and parched at this time of the year, mostly due to frost and rain....." - Football Commentator, BBC 2