How to make dropdown menu like "delicious" and "google" ?

Question

Hi,

I want to make a dropdown menu like delicious has at this http://delicious.com/search?context=all&p=sql&lc=1 page. In this page click the arrow which is with "Search" button. On click it displays a drop down menu, I want the same menu style but on my page I am having a link, what I want with that link a simple small icon will be displayed and on click of the link or that menu image, a dropdown menu will open.

Google has also done the same thing, http://www.google.co.in/firefox?client=firefox-a&rls=org.mozilla:en-US:official click on the "more" link in the top menu displayed.

I want to use minimal javascript, I prefer JQUERY.

Answer 1

There is a lot of jQuery pluging that create a drop down list (Menu) like delicious.
you can use:

1. JdMenu
2. Drop down menu with jquery
3. Free CSS Drop-Down Menu Framework

Answer 2

The easiest way to do this is to set up the menu in Javascript. There are a number of available Javascript libraries available to make this easier. Some of the more popular ones include:

• Yahoo User Library
• Dojo
• JQuery

Answer 3

I always recommend Son of Suckerfish for menus like this. CSS only, so it works even for users without scripting, and is extremely lightweight and fast for it.

Answer 4

You can try to play with some lists. It's an older post on my blog about how you can do a nice breadcrumb with lists and some piece of jquery.