Drop Down Menus have been part of the DHTML dictionary for a long time. They're a popular way to cram lots of navigation elements into a small amount of space. They work in a similar way to the menus that everybody is used to using in other programs, so offer a familiar environment.
The trouble is that many of the DHTML menus you'll find out there are from the bad old days of the browser wars, they use huge amounts of code to check for compatibilities, and fail to take into account accessibility or web standards.
In this article we'll look at some of the ways you can build a Drop Down menu using CSS and W3C DOM (document object model)-based JavaScript. We'll also look at some options for improving the menu's accessibility.
A basic knowledge of JavaScript and CSS is recommended for this tutorial.
Need to create all kind of great web site navigation menus? Cascading Drop down Menus, Mega Menus, Popup or Context Menus. Menus that have great display animations, are CSS based and fully cross browser compatible, which makes them search engine friendly?
A man of many talents, Matt has been a web designer, technical editor, and jewellery picker. He is currently on contract for the Birmingham City University, producing pages for research centres.
