Dynamic Drive, a great resource for web designers & developers has a nice collection of free CSS menus that you may find handy.

There are several horizontal and vertical menu examples, buttons, pagination samples & more.

Besides these CSS menus, Dynamic Drive is worth to browse deeply & regularly as new resources are added frequently.

This is a lightweight (only 1kb), accordion type JavaScript horizontal menu that does not require any JavaScript frameworks.

It is very easy to setup as the script automatically adjusts to the number of elements in the accordion and the dimensions of the accordion.

How it works?

• Create an unordered list like this:

<ul id="sm" class="sm">
<li><img src="images/1.gif" alt="" /></li>
<li><img src="images/2.gif" alt="" /></li>
<li><img src="images/3.gif" alt="" /></li>
<li><img src="images/4.gif" alt="" /></li>
</ul>

• Call the function below onload

slideMenu.build('sm',200,10,10,1)">

• That’s all.

Parameters:

• First: id of the unordered list
• Second: width of the accordion
• Third: timeout variable to control how quickly the sliding function is called
• Fourth: speed of the accordion with 1 being the fastest
• Fifth: is the integer that corresponds to the section you would like to be expanded when the accordion is loaded (optional)

iPod-like jQuery drilldown menu provides easy navigation of complex and multi-level menus.

The menu sits within a fixed-size area, and when a node is selected, breadcrumb links appear above the menu options to both deliver feedback and allow quick access back to nodes higher up in the hierarchy.

An iPod-style slide transition helps providing the feelthat you’re moving forward into the data, or backward into higher-level data.

This menu is specifically useful in browsing deeply nested hierarchies, particularly those more than three levels deep. It also provides a more usable alternative to multi-level fly-out menus, which can present challenges to those with limited manual dexterity.

It is not coded for ease of modification, but is free to reuse and modify with a proper attribution to Filament Group. Feel free to visit the demo page and view the source code to see how it works

Tabbed content areas are a popular solution for the "lots of content – few space" problem.

Nettuts, a great tutorial website about web design & development has a nice example of creating a tabbed content area with jQuery & CSS.

When clicked to the tabs, content area switches to the new content with a slick accordion type effect.

Besides getting the ready to use codes from the tutorial, you can see how every step of the project is completed.

Here is the final demo of this tabbed content area.

Dock menus are very handy when it comes to limited space in designs. They just appear when needed and this idea expands the website area so much.

Webber 2.0 Dock Menu is a nice JavaScript docking menu which is easy to implement and does not require any JavaScript frameworks.

It is built with the Philippe Maegerman’s tween class. The logic of the menu is very simple:  an empty div which determines the mouseover area for the docking effect and that’s it. Simple but very functional.

ADxMenu is a JavaScript and CSS drop-down menu solution which web designers will find easy to modify.

It supports unlimited sub-menus and offers a simplified usage as it uses the well-known <ul> <li> tags to create the menus rather than JavaScript configurations (JavaScript editing can be done for extra modification).

ADxMenu works in most of the modern browsers (an extra solution exists for IE6) and supports both horizontal & vertical menu types, even right-to-left and bottom-to-top.

woork, a blog that has some very nice web resources, shows how to create the famous digg-like navigation with a tutorial & source files.

The tutorial also explains how to create liquid & rounded corner items that you may find useful.