Lesson Eleven: The Current Code

Your current CSS code should look like this:

body { background-color: tan; font-family: Georgia, "Times New Roman", Times, serif; line-height: 1.6em; }
h1{ color: maroon; }
input { color: darkblue; font-size: 25px; width: 550px; margin-top: 10px; }
#b6 { margin-top: 10px; font-size: 20px; color: blue; }

Your current JavaScript code should look like this:

var event1;
event1 = "488 Million Years Ago the Mollusks Appeared";
var event2 = "250 Million Years Ago the Dinosaurs Appeared";
var event3 = "65 Million Years Ago - Age of the Mammals";
var event4 = "60 Million Years Ago - The Primates";
var event5 = "5.2 Million Years Ago - The Hominids";
var eventchoice;

function historyevents(eventnumber) {
eventchoice = eventnumber;
if (eventchoice == 1) {
button = document.getElementById("b1");
button.value = event1; }
else if (eventchoice == 2) {
button = document.getElementById("b2");
button.value = event2; }
else if (eventchoice == 3) {
button = document.getElementById("b3");
button.value = event3; }
else if (eventchoice == 4) {
button = document.getElementById("b4");
button.value = event4; }
else {
button = document.getElementById("b5");
button.value = event5; }
}

Your current HTML code should look like this:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Five Events in History</title>
<link rel="stylesheet" type="text/css" href="histevents.css">
</head>
<body>
<h1>Five Events in History</h1>
<input type="button" id="b1" value="Click the Button to see Event One" onclick="historyevents(1);">
<input type="button" id="b2" value="Click the Button to see Event Two" onclick="historyevents(2);">
<input type="button" id="b3" value="Click the Button to see Event Three" onclick="historyevents(3);">
<input type="button" id="b4" value="Click the Button to see Event Four" onclick="historyevents(4);">
<input type="button" id="b5" value="Click the Button to see Event Five" onclick="historyevents(5);">
<input type="button" id="b6" value="Reset" onclick="location.reload();">
<script src="histevents.js"></script>
</body>
</html>

Lesson Twelve: Loading Images with JavaScript

Coding

Lesson Eleven: The Current Code