CSS Cascading Menu02/07/2005 09:09:44 AMI spent the weekend finishing up another CSS article for Lotus Advisor. This is actually the sixth in my series but I mention it because this one in particular covers some fairly interesting ground you might actually have a use for.
I've started doing something a little different in this series than I did in either of my prior two (on LotusScript and JavaScript). Starting with the fifth article (March 2005), having already established a base of understanding, I started the process of building an application which takes advantage of CSS and of some of the native Notes/Domino capabilities.
Kind of like a series within the series.
In that article, I built the main parts of the base form for a self-building web site which used positioning to control its look and feel.
This month (April 2005) I stepped back and did a step-by-step description of how to build cascaded menus like the one shown below from the simple code used to build an unordered list like the one shown to the left.
You can try it here: Roll your mouse over the words in the menu below and some of them have sub-categories, some of those sub-categories have sub-sub-categories, and so on. It's pretty cool and amazingly easy to do.
In the May issue I'll take what we learned about cascading menus this month and build it into the application.
Don't get me wrong: This isn't exactly rocket science, and I'm certainly not the first one to think of it. Rocky Oliver blogged about it a while ago and has another article in the same issue as mine based on the same underlying CSS premise; the difference being I'm concentrating on the CSS, he's working on some very interesting @Formulas to generate the underlying HTML.
Rocky stole, er, acquired the idea from the same place I did, CSS Creator who, in turn, stole it from the Suckerfish Dropdowns example on the A List Apart site. Eric Meyer, He-Who-Walks-On-Water-With-CSS, has covered it in one of his books, too, so there is a long and honored tradition of stealing this code, or at least the core of it.
I am hoping to at least add a little new value to the stream, though, by using LotusScript to read a Notes view and build the underlying list and links on the fly when you open a form. The idea is to have it read the hierarchy of the view and to duplicate that as a cascaded menu. As the site changes, so, too, will the menu, without any need for designers or developers to do anything. Should be cool.
I haven't actually built it yet, of course, as that's something I'll get around to when I'm writing the article, but it should only take a few lines of recursive LotusScript to do it.
I've said it before and will probably say it again but this CSS stuff is really pretty amazing and even more so when you combine it with the power of Domino.
