HTML and CSS Reference
In-Depth Information
To Copy and Paste the Navigation Bar, Event Handlers,
and Image Rollover Functions
To maintain consistency in looks among all the Web pages, the Gift Shop Web page
should use the same navigation bar, event handlers, and image rollover functions created
for the Hickory Oaks Forest Preserve Home page.
1
Open the chapter11-1homesolution.html file in Notepad++ in the Chapter11\ChapterFiles
folder, if necessary.
2
Copy the HTML <table> code from lines 97 through 116 (the HTML code and mouse event
handlers for the navigation bar).
3
In the chapter11-1shop.html file, click line 62 and paste the code to create the
navigation bar.
4
Modify line 65 to replace the # symbol with
chapter11-1homesolution.html
.
5
Modify line 74 to replace the chapter11-1shopsolution.html with a # symbol.
6
In the chapter11-1homesolution.html file, copy the JavaScript code from lines 6 through
21. Return to the chapter11-1gifts.html file and insert the copied code for the navigation
bar image rollovers on line 6. After the } brace, press the
e n t e r
key twice. Add the closing
HTML comment (
//-->
) and the closing
</script>
tags on lines 23 and 24 and do not
press the
e n t e r
key (Figure 11-20).
shop Web page
name displays on tab
user-defined functions
for image rollover
navigation bar
Figure 11-20
