Digg Type Menu With CSS

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

CSS Digg Menu

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

Liquid Round Corner CSS

Drop-Down Menu Simplified: ADxMenu

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

  • tags to create the menus rather than JavaScript configurations (JavaScript editing can be done for extra modification).

    Drop Down Menu Script

    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.

Dock Menu Script For Functional Navigations

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.

Dock Menu

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.

Tabbed Content Area With jQuery And CSS

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.

JavaScript Tab Content

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.

iPod-Like Drilldown Menu With jQuery

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.

jQuery iPod Menu

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