RE: Create Top Drop Down Menus with CSS and/or JS

by "Kender" <hwg(at)>

 Date:  Sat, 12 Feb 2005 03:11:59 -0600
 To:  "'HWG-Techniques'" <hwg-techniques(at)>
 In-Reply-To:  zagdesign
  todo: View Thread, Original
Try this tutorial.

Jim Wheeler
Kender Internet Kompany

-----Original Message-----
From: owner-hwg-techniques(at) [mailto:owner-hwg-techniques(at)] On
Behalf Of Janet Zagoria-Zagdesign
Sent: Friday, February 11, 2005 11:04 PM
To: HWG-Techniques
Subject: Create Top Drop Down Menus with CSS and/or JS

Recently there was a discussion about creating sidebar menus with CSS. I
started reviewing some of this and saw it being done with drop down menus
that fly out from a vertical list of navigation one would use on a sidebar.

However, what I am looking for is how to do this when the navigation goes
across the top of the page like:
Home    Services   About Us    Contact
Then each section, when hovering on the nav word, will show a drop down (or
spread out) menu of what is in that section, like:
About Us
   Mission   Staff   History
So the second line appears only when hovering and is clickable for the
visitor to go straight to the History page, for instance, from any page
having this navigation.

I have done this numerous times with Javascript using images (and JS with
Imagemaps, as well). I tried to figure out how to do this in JS without
images (browser text) and/or CSS without JS but cannot find the code.

Can anyone point me to a site or a script that does this (JS is fine to
incorporate) and be safe for most browsers?

Thanks for any help.
Janet Zagoria
Web Site Designer/Developer

HWG hwg-techniques mailing list archives, maintained by Webmasters @ IWA