Web Development and Design Foundations with XHTML, 5th Edition

(^572) Chapter 14 A Brief Look at JavaScript
value. For example, the hypertext link for the services.html page should be
modified as follows:
<a href="services.html"
onmouseover="document.services.src='serviceson.gif'"
onmouseout="document.services.src='services.gif'">
Note that document.services.srccorresponds to the srcattribute on the

tag with the name attribute value of services. When the user places
the mouse pointer over the image link, document.services.srcis set to the
new image file (serviceson.gif). When the user moves the mouse pointer off of the
image link, document.services.srcis set to the old image file (services.gif).
The image links for the Home, Ask the Vet, and Contact pages should be mod-
ified similarly to the Services image link. Save your page and test it in a
browser. You should see the images swap.
In a similar manner, add image rollovers to the services.html, askthevet.html,
and contact.html pages. Save your pages and test in a browser.

2. Add the date last modified to the home page.
   Launch Notepad and open the index.html page. Modify the index.html page as
   follows:
   ● In the page footer section after the e-mail link, add a script block that will
   write the following message to the document:
   This page was last modified on: date
   ● Use the document.lastModifiedproperty to display the date.

Pasha the Painter

See Chapter 2 for an introduction to the Pasha the Painter Case Study. Figure 2.34

shows a site map for the Pasha the Painter Web site. The pages were created in earlier

chapters. Use the Web pages indicated in this exercise from the Chapter 9 paintercss

folder. You have two tasks:

1. Add an alert message that welcomes the user to the Pasha the Painter Web site
   when the user displays the home page (index.html).


2. Add form data validation to the estimates.html page such that if the name, e-mail
   address, or phone number input boxes are empty, the form will display an error
   message and will not submit.

Hands-On Practice Case

1. Add an alert message that welcomes the user to the Pasha the Painter Web site
   when the user displays the home page (index.html).
   ● Launch Notepad and open the index.html page from the paintercss folder.
   ● Edit the tag as follows:
   "alert('Pasha the Painter can handle your painting needs!');">
   ● The load event occurs when the Web page begins to load in the browser. The
   onloadevent handler in this case pops up an alert message.
   Save the file and test it in the browser.