css menu links and flyouts

I’m redesigning my site and considering using GRC’s Pure CSS Menu.http://www.grc.com/menu2/invitro.htm which relies on css with no javascript.
Has anyone used?
I’m looking to figure out a way to reference the menu links from the external css file and not the pages. When making changes, I don’t want to visit every page to add a menu link.
Also, I like the new design of Amazon that uses menu flyouts using DHTML as I have alot of landing pages to reference in categories. Hover over the down arrow keys at the top of the main page and see a menu flyout with links to other pages. This looks alot better than the old method they had with tabs.
Is there a css book/guide/site somewhere that explains in detail how this is done by using flyouts?

GRC’s menu should be very straightforward to put together as Wayfinder templates, and the CSS is just the CSS. You need to then insert the call to the menu in your template and everything goes on autopilot, with no manual updating required.

These are very similar to a CSS Play menu that I’ve used on other sites, and WayFinder had no problems putting those together (I even did the first one in the old DropMenu snippet). I don’t use these anymore, however, because I don’t like all those conditional comments cluttering up my markup (just a personal opinion). Most of the sites that I do require JavaScript anyway (and 94+% of users have it on), so I’ve moved to using Superfish menus instead (also with WayFinder, of course).

Thanks Zap-er and Thrash-er. I had read of Wayfinder. Need to read further into.
What about those flyouts? Anyone ever worked with or know of a book/site that discusses? I’d like to find out how to do those. Would be helpful with all the categories I have, and is slick looking.

You mean the categories menu to the left ("Shop All Departments")? Those are just regular vertical flyouts with some styling applied to the submenus. Check out this CSS-only example.

No, that stuff is old school. I’m talking about the flyout menus where the down arrows are at the top.
Also, see this example, that shows merchandise within the flyout - http://www.ae.com/web/index.jsp, which appears to be gobs of Javascript coding. Also, look here - www.officemax.com that has an alphabetical index.

Aha. I didn’t notice those. They are pretty fancy.

You could probably make something like that work in WayFinder as long as your documents (or equivalent weblinks) are organized the way that you want them to appear in the menus. If not, then you could probably create a hybrid of WayFinder and Ditto (to create the links to pages with specific tag or other values). If you want images in the background of some of these menus you can style them in CSS, and if you want to add extra content to only certain drop-down displays you should ask in the WayFinder forum for tips (although if you do both of these you might be better off just making your menus a chunk with Ditto calls, since using WayFinder to create a different display for each drop-down seems counter-productive).

Something like these CSS Play dropline menus would be a good starting point.

That’s a good resource. Will look further into that one. I’ve been to his site several times. He’s quite talented.