HTML and CSS Reference
In-Depth Information
5. Create a function named startClock() that will start the Web page clock and then
repeatedly update the elapsed time displayed in the clock. There are no parameters
to this function. Add the following commands to the function:
a. Call the showQuiz() function to display the questions in the online exam.
b. Call the runClock() function every second, storing the ID of this timed-interval
command in the clockId variable.
6. Create a function named stopClock() that will stop the timer, display the user's
score, and disable the exam to prevent further entry. There are no parameters to this
function. Add the following commands to the function:
a. Halt the repeated calls to the runClock() function. (Hint: Use the
clearInterval() method described in this tutorial.)
b. Call the gradeQuiz() function, storing the value returned by the function in a
variable named correctans .
c. Display an alert box containing the text string
You have correctAns correct of 5 in timer seconds.
where correctAns is the value of the correctAns variable and timer is the
value of the quizclock field in the quiz form.
7. Locate the input button for the Start Quiz button. Add an event handler attribute that
runs the startClock() function when the button is clicked.
8. Locate the input button for the Submit Answers button. Add an event handler attri-
bute that runs the stopClock() function when the button is clicked.
9. Add an onload event attribute to the <body> tag to run the resetQuiz() function
when the page is loaded by the browser.
10. Save your changes to the file.
11. Open trivia.htm in your Web browser. Verify that clicking the Start Quiz button
displays the quiz questions and starts the timer. Then verify that clicking the Submit
Answers button stops the timer, disables the exam, and displays an alert box with
the number of correct answers and the elapsed time to complete the exam. Finally,
verify that refreshing or reloading the Web page restores the form and the timer to
their original condition.
12. Submit your completed files to your instructor, in either printed or electronic form,
as requested.
Case Problem 2
Use JavaScript
to create an
online standard
data Files needed for this case Problem: bboard.png, calctxt.htm, modernizr-1.5.js,
mtlogo.png, mtstyles.css
The Math Table Theresa Kaine runs The Math Table, a Web site containing math resources
for homeschooling families and educators. She wants to add an online calculator to the
site and has asked for your help in designing a simple prototype. Theresa already has
designed the Web page and would like you to write the JavaScript code to make the cal-
culator work. A preview of Theresa's sample Web page is shown in Figure 11-39.
Search WWH ::

Custom Search