Drop down menu snippet

[Guest]

Welcome, Guest. Please login or register.
Did you miss your activation email?

1 Hour 1 Day 1 Week 1 Month Forever
Login with username, password and session length

[Robsta]

Can anyone recommend a good drop down menu snippet?

[sottwell]

DropMenu, of course!

[Robsta]

DropMenu, of course!

Does it? I looked at it, but decided it didn't do the menu drop down bit... will look at it again. Are there any exmples?

[sottwell]

It does whatever you want.  It's all in the CSS.

[Robsta]

It does whatever you want.  It's all in the CSS.

I'm after a horizontal top level menu with a drop down list from each section on mouse hover. Would i use the float CSS style to get it to drop down?

[sottwell]

You would float the first row, use display:none to hide the rest, then hover classes with display:block to make the dropdowns.  There are plenty of good tutorials on the Internet, use Google with "css dropdown menu" as the search.

[Robsta]

You would float the first row, use display:none to hide the rest, then hover classes with display:block to make the dropdowns.  There are plenty of good tutorials on the Internet, use Google with "css dropdown menu" as the search.

Thank you Susan, you're a star!... today I've learnt something new. 

[rthrash]

How many times do I have to say it: she's a ninja!

[sottwell]

Well, I guess one out of four isn't too bad...

[Robsta]

Some things are never as simple as they seem. CSS stylng a drop down menu is a complete nightmare! I gave up on using the Dropmenu, so I tried ListMenu. Was more successful with that one, but still no cigar. IE is terrible!

So I eventually thought I'd try phplayersmenu and got it working. Not quite the nice simple solution, but does what I need.

Or so I thought. It's presenting me with a problem. When some documents become parents, the addressing for those documents becomes completely messed up. For example, three documents, nothing significant about them, fairly empty documents all using the same template. One document used as the child, it all works fine, but if I then move it to the other document as a child, the previous parent ID (or FURL name, I tried FURLS disabled and enabled) get's transfered to the new parent, with a hash '#' suffix. Move the child back, all fine again. Tried two new documents, same issue occurred.

All three snippets are non-uncached.

 

I'm glad it's weekend now. It means I have two days to sort it all out!  DOH!

I might try transmenu next.

[rthrash]

Try this on for size ... DropMenu was built to make generating the html automatic for menus like the first one below. (When using the right calls of course!) This was done by my good buddy John Gallant who I did the Mac testing for on the article:

http://www.positioniseverything.net/css-dropdowns.html

Note that you can even hover off of the menus a little bit and still maintain their dropped down state. Very cool stuff!

Another CSS menu is a bit more crazy and is on a customer's site: http://landplan.net/ It shows 4 or 5 different techniques and variations of styling UL based navigation, including the last double column. That's a MODx site, too, using an early precursor to DropMenu. Could do that one now without having to hack up the code in DM I think.

[sottwell]

That's GORGEOUS!

[Robsta]

Wow, that landplan menu is fantastic... very impressive.

I'll have another go with dropmenu, thanks for the links.

[rthrash]

Might I suggesst never trying to reproduce a menu like landplan... I was determined to make it work and there are SO many tricks employed to getting it to do so and also are what spurred the commented out force stuff at the bottom of the main htaccess file... causes images to stop flickering on hover in IE... andother one of it's nice "features"

[Robsta]

Might I suggesst never trying to reproduce a menu like landplan...

I wouldn't know where to start! LOL!