Drop down menu: how to setup this HTML

I’ve kind of skimmed over how drop down menus work in JS(notably jquery).

Also I read you put the submenu nested within it’s parent link(<li>).

This proves to be a problem though because my <div id=“nav”> I have, is setup to display inline (horizontal) and obviously with a drop down you want that vertical…

Do I have to separate the submenu from the <div id=“nav”>, or does the submenu have to be nested?

I’m pretty confused how this would work.:eek:

Depending what menuing system you are using, I assume a pre built one, there is a flag you set somewhere that says this is a horizontal menu vs vertical. The JS then automatically flies the sub in the right direction. You still nest sub menus within the appropriate menu li.


The navigation from this website I made is very similiar to the one I’m trying to setup the submenus for right now.

There is no submenu in this site, but you can see how I set my HTML and CSS Sprite up.

Depends on who most people are…
Me: I am not a heavy JS guy, so i don’t want to sit down and write my own. so since I know YUI’s menu passes the two things I am passionate about (accessibility and keyboard navigation) I use YUI. Maybe one day I will rip apart YUI and find a bug. But since I have talked to a guy on YUI, I would send it to him to fix the code for everybody.

Others: I saw a post on here saying YUI library was crap and don’t use it. I didn’t see a reason why they think it is crap.

ah okay. So before you put in the JS your nav menu should look pretty messed up then ha.

I have a buddy who does my JS and I jsut wanted to be sure that I had everything setup.

How hard is it to do this from scratch(jquery)?

So most people don’t really code this kind of stuff from scratch? They use plug ins or something?

No idea to be honest. I use YUI to handle my menus because it is accessible and keyboard navigatable. YUI allows me to build my menu using lists or js. I use the list version, which is a big nested list with certain class/id names. I code in PHP, so my navbar is it’s own file and I just inlcude it…