HTML and CSS Reference
In-Depth Information
Complete the following:
1. Use your text editor to open the malltxt.htm file from the tutorial.11\case4 folder,
enter your name and the date in the head section, and then save the file as mall.htm
in the same folder.
2. Insert a Web form named mallclock that has the following fields:
a. A dayNow field, which will display the current date in the format month/day/year
b. A timeNow field, which will display the time in 12-hour format
c. A days field, which will display the number of days until the mall opens
d. An hours field, which will display the number of hours left in the current day
e. A minutes field, which will display the number of minutes left in the current
hour; round this value to the nearest minute
3. Add the remaining content to the Web page. Refer to the mall.txt text file in the
tutorial.11\case4 folder for the content that Alice wants you to include. Insert any
styles for the Web page in an external file named mall.css . Link the mall.htm file to
this style sheet.
4. Use your text editor to open the timetxt.js file from the tutorial.11\case4 folder,
enter your name and the date in the comment section, and then save the file as
time.js in the same folder.
5. In the file, add the following functions (refer to the functions and codes from the
tutorial case for help in writing these functions):
a. A daysDiff() function that calculates the number of days, rounded down to the
next lowest integer, between a starting date and a stopping date
b. An hoursDiff() function that calculates the number of hours left in the current
day rounded down to the next lowest integer
c. A minutesDiff() function that calculates the number of minutes left in the cur-
rent hour rounded down to the next lowest integer
d. A showDate() function that displays the value of a Date object in the format
month / day / year
e. A showtime() function that displays the value of a Date object in the format
hour : minute a.m./p.m.
6. Insert a script element in the mall.htm file to link it to the functions in the time.js
script file.
7. Add an embedded script to the mall.htm file. Use the functions from the time.js ile
to create a function named countDownClock() that displays the current date and
time in the document as well as the days, hours, and minutes remaining until the
mall opens. Assume an opening date of March 23 and an opening time of 9:00 a.m.
For the year, use a starting year value of the current year; but if the current date falls
after March 23 of the current year, change the year value for the opening date to the
next year. (Hint: Apply conditional operators along with the getFullYear() and
setFullYear() functions to set the year value of the opening date.)
8. Have the countDownClock() function run when the page initially opens, and then
every 60 seconds thereafter.
9. Submit your completed files to your instructor, in either printed or electronic form,
as requested.
Search WWH ::




Custom Search