HTML and CSS Reference
In-Depth Information
Complete the following:
1. Use your text editor to open
mpl2txt.htm
from the tutorial.10\review folder
included with your Data Files. Enter
your name
and
the date
in the comment section
of the file and save the file as
mpl2.htm
in the same folder.
2. In the head section, just above the closing
</head>
tag, insert a
script
element that
accesses the code in the
random.js
ile.
3. Add an embedded
script
element for the code that you'll add to the mpl2.htm file.
4. Within the embedded
script
element, create a function named showImg(). The pur-
pose of this function is to write an inline image tag into the current document. The
function has no parameters. Add the following statements to the function:
a. Add the following multiline comment to the start of the function, just below the
opening
showImg()
function statement:
the showimg() function displays a random image from the 0.png through 9.png
files. the random image is designed to thwart hackers attempting to enter the
library records database by requiring visual confirmation.
b. Declare a variable named
imgnumber
equal to the value returned by the
randomInteger() function. Use
9
as the value of the size parameter in the
randomInteger() function.
c. After the statement that creates the imgNumber variable append the following
single-line comment:
Return a random number from 0 to 9.
d. Insert a command that writes the text
<imgƒsrc='
imgNumber
.png'ƒalt=''ƒ/>
to the document, where
imgNumber
is the value of the imgNumber variable.
5. Scroll down to the bottom of the file and locate the last table cell in the document.
Within this empty table cell, insert a
script
element.
6. Within the
script
element, call the
showImg()
function five times. You do not need
to specify a parameter value.
7. Save your changes to the file.
8. Open
mpl2.htm
in your Web browser. Verify that each time you refresh the Web
page, a different sequence of five image numbers appears at the bottom of the Web
form. Debug your code as necessary using any of the tools or techniques described
in this tutorial.
9. Submit your completed files to your instructor.
Use the skills
you learned in
this tutorial to
create an online
star map.
Case Problem 1
Data Files needed for the case problem: datetime.js, mask.gif, modernizr-1.5.js, sky0.jpg -
sky23.jpg, skymaptxt.htm, skyweb.css, skyweb.jpg
SkyWeb Astronomy
Dr. Andrew Weiss of Central Ohio University maintains an astron-
omy page called SkyWeb for his students. On his Web site he discusses many aspects
of astronomy and stargazing. One of the tools of the amateur stargazer is a planisphere,
which is a handheld device composed of two flat disks: one disk shows a map of the
constellations, and the other disk contains a window corresponding to the part of the sky
that is visible at a given time and date. When a user rotates the second disk to the current
date and time, the constellations that appear in the window correspond to the constella-
tions currently visible in the nighttime sky.
