Quiz Calgeo

(calgeo-1)

[[html]]
<html>
<head>
<title>Quiz</title>
<script type="text/javascript">
<!— from http://tech.avivo.si/2011/01/javascript-alert-message-box-alternative/ —>
function print(txt, title)
{
txt = txt.replace(/\n/g,"<br />");
if(!title) var title = "Feedback";
var template = "<div id='message_box' style='width:100%;"+
"border:2px outset #ccc;background-color:#eee;'>"+
"<div style='background-color:#5d5d92;color:#fff;font-weight:bold;"+
"padding-left:5px;'>%TITLE%</div>"+
"<div style='padding:15px;'>%TEXT%</div>"+
"<input type='button' value=' OK ' "+
"onclick='document.getElementById(\"message_box\").style.display=\"none\"'"+
" />"+
"</div>";

var to_write = template.replace("%TITLE%", title);
to_write = to_write.replace("%TEXT%", txt);

if(document.getElementById("print_area"))
{ //If the 'print_area' exists, just write our data into it.
document.getElementById("print_area").innerHTML = to_write;
}
else
{ //Else create the element before writing the data.
var div = document.createElement("div");
div.setAttribute("id","print_area");
div.innerHTML = to_write;

var body = document.getElementsByTagName("body")[0];
body.insertBefore(div,body.firstChild);
//OR body.appendChild(div); //This will insert the message box at the end of the page.
}
}
</script>
</head>
<body bgcolor=#ffffff>
<hr>
<form>
Approximately how many miles is California north-south?<p>
<table style="border:1; width:100%;">
<tr>
<td style="vertical-align: top; width:20%;"><input type='button' value='A' onClick='print("INCORRECT. Way too small. About 1/10 the correct value.", "Feedback")'>104</td>
<td style="vertical-align: top; width:20%;"><input type='button' value='B' onClick='print("INCORRECT. Off by about 400 miles!", "Feedback")'>640<p></td>
<td style="vertical-align: top; width:20%;"><input type='button' value='C' onClick='print("CORRECT", "Feedback")'>1040<p></td>
<td style="vertical-align: top; width:20%;"><input type='button' value='D' onClick='print("INCORRECT. About 800 miles to many. This is more like the distance from San Diego to Chicago.", "Feedback")'>1840<p></td>
<td style="vertical-align: top; width:20%;"><input type='button' value='E' onClick='print("INCORRECT. Off by a factor of ten. Ten thousand miles is about half way around the world.", "Feedback")'>10400<p></td>
</tr>
<tr>
<td colspan="5" id="print_area" style="height:100px; vertical-align: top;"></td>
</tr>
</table>

</form></body>
</html>
[[/html]]