Advice about vBulletin-like drop-down menu


I’ve been looking online to see if there are any sites which advise about how to get the same effect as one sees on VBulletin forum sites, including SitePoint.

What I’d really like is to work out how to create the drop-down menu which appears when clicking against the menu options with the little triangle on, e.g. on the view-thread page, these on the right at the top of the page:

Thread Tools     	 Search this Thread     	 Display Modes

I suppose I could look at the JS / CSS that powers the one on SitePoint, but there are understandably copyright notices on the code, so I don’t want to just steal it.

I know there are tonnes of sites about how to do a drop-down menu on a site, but I don’t want a full width CSS menu, just a small one that can be invoked with a click.

Any advice much appreciated.



This is really a javascript question but I have a small demo that might be useful here.

That was part of a bigger menu so some of the code is redundant but shows how it works. If you want multiple menus then you will need to adjust the code to work with extra ids (or classes perhaps although that’s more complicated) as it only looks for the one item (#nav) at present.


or multiple menus with classes like so:

Bear in mind JS is not my thing :slight_smile:

If you are already using something like jquery in your page then they have many routines that will do this kind of hide and show but it is not worth adding jquery just for this small effect though.

Wow - thanks Paul - I’ll be able to use that. Thanks very much indeed!