Multiple level drop down menus using CSS (Suckerfish Menus)
Friday, May 30, 2008, 05:00 PM
Posted by Administrator
I have been looking into adding drop down menus to a web site I am building at present and I have found some examples of coding them using Cascading Style Sheets instead of complex JavaScript which is very browser dependent. I first found it on the Met Offfice web site where I was looking at the source code. The original idea was from Patrick Griffiths and Dan Webb and the original Suckerfish Dropdowns article published in A List Apart proved to be a popular way of implementing lightweight, accessible CSS-based dropdown menus that accommodated Internet Explorer by mimicking the :hover pseudo-class.
Since then they have been considerably refined and involve just a dozen lines of JavaScript to bring compliance to the CSS standards to Internet Explorer, have greater compatibility (they now work in Opera and Safari without a hack in sight) and can have multiple-levels. The latest information can be found at HTML Dog and there is generator for advanced versions at PixoPoint .
I have put the CSS required into a file which can be included on every page where the Dropdowns are needed and likewise the JavaScript. There is a test page with all the current contents of the .css and .js files at
New Document Template with Dropdown Menu
[ add comment ]
( 1 view )
|
permalink |





( 2.9 / 273 )
| 1 | Next> Last>>