Hover Menu4. Customize the Menu |
|
Join the DiscussionMore of this FeatureThe final step is to add the HTML for our hover menu into the body of our web page. Since it will be automatically moved to the bottom right corner of the screen and will not display until the page finishs loading it doesn't really matter where in the body of your page that you define it. Either immediately after the body tag or at the very bottom of the body is probably a good spot so that it is not in the middle of some other content within your page that may break the functionality. Here is the code that I used for the hover menu on this page. The part shown in bold must be coded exactly as shown while you can replace the rest with whatever code that is required for your navigation links.
<div id="hovmenu"><div
id="menu">
<a href="blhover1.htm">1. Introduction</a><br> <a href="blhover2.htm">2. Get the Script</a><br> <a href="blhover3.htm">3. Get the Stylesheet</a> </div><a href="#" onclick="toggleDisplay('menu');">menu</a></div> |
Explore JavaScript
Must Reads
About.com Special Features
Build Your Own Website
Step-by-step advice on how to do everything from choosing a Web host to promoting your content. More >
Connect Your Home Computers
Easy ways to connect two computers for networking purposes. More >
©2009 About.com, a part of The New York Times Company.
All rights reserved.