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

by "Kender" <hwg(at)Kender.org>

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

http://www.htmldog.com/articles/suckerfish/dropdowns/

Jim Wheeler
Kender Internet Kompany
http://kender.org


-----Original Message-----
From: owner-hwg-techniques(at)hwg.org [mailto:owner-hwg-techniques(at)hwg.org] 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
www.zagdesign.com

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