PDA

Click to See Complete Forum and Search --> : adding a style to this script

eskymo
03-05-2003, 06:25 AM
Hi there

i'm wanting to add a style to the text responses in the following script. Does anyone know how to do this? I can link the htnl page to the relevant stylesheet, but need to know how to apply the styles in the javascript.

heres the code:


<script type="text/javascript">
var recieved = location.search.substring(1);
var questionAndAnswer = recieved.split('&');
var total = 0;
for (var i = 0; i < questionAndAnswer.length; ++i) {
var answer = questionAndAnswer[i].split('=')[1];
total += parseInt(answer);
}
if (total < 20) { // adjust the values so they suit the possible scores that can be achieved from the quiz
document.write("oh dear, you only scored " + total);
} else if (total < 30) {
document.write("you scored " + total);
} else if (total < 40) {
document.write("you scored " + total);
} else {
document.write("congratulations you scored " + total);
}
</script>


cheers

e
khalidali63
03-05-2003, 06:34 AM
in javascript here is how you add style

objectName.style.styleProperty = "value"

such as
obj.style.backgroundColor = "green"

Keep in mind that if a style property is large name such as background-color the second word will always start with caps

background-color = backgroundColor

and

color = color

Cheers

Khalid
eskymo
03-05-2003, 06:37 AM
where would i insert this ??
khalidali63
03-05-2003, 07:53 AM
The code segment you have posted, does not have any reference to any object to which you'd apply style,you are using document.write tp just dump any data on the page.

create a div tag in the body section
<body>

<div id="results"></div>
then replace the following code segment

if (total < 20) { // adjust the values so they suit the possible scores that can be achieved from the quiz
document.write("oh dear, you only scored " + total);
} else if (total < 30) {
document.write("you scored " + total);
} else if (total < 40) {
document.write("you scored " + total);
} else {
document.write("congratulations you scored " + total);
}


with the one below


var obj = document.getElementById("results");
if (total < 20) { // adjust the values so they suit the possible scores that can be achieved from the quiz
obj.innerHTML = ("oh dear, you only scored " + total);
obj.style.color="red";
} else if (total < 30) {
obj.innerHTML = ("you scored " + total);
obj.style.color="green";
} else if (total < 40) {
obj.innerHTML = ("you scored " + total);
obj.style.color="orange";
} else {
obj.innerHTML = ("congratulations you scored " + total);
obj.style.color="lightyellow";
}
}
</script>
</head>
<body>
<div id="results"></div>



Cheers

Khalid