17 Stunning DHTML Menu Builder Ideas For Web Developers

1. Smart Responsive Menu

featured image

Smart Responsive Menu is powerful dropdown menu solution that will work with mobile devices and different screen sizes. Menu relies on CSS media queries to modify menu display for different resolutions. For less than 480px, menu changes from CSS horizontal menu into vertical and gets hidden behind the menu item. Due to the many differences between mobile browsers, different support for CSS, menu must use JavaScript to make up for these problems. There is no way to make menu universally work without use of JavaScript.Easy to use builder to test effects and colors

Page with the style and effects builder allows you to see how each effect looks like with different built in color styles.Plugin control is done by combining CSS classes on the menu element with many options available with the jQuery plugin.You can combine different effects to display the menu:

Menu Links: with three types of characters and arrows

Various demos and examples to show how menu can be set

Style builder for testing each of the styles and effects

Added: Vertical menu open/close animation

Fixed: Box-shadow effect for responsive menu toggle jQuery state

More Details

2. Apycom jQuery Menus

Apycom jQuery Menus

Full cross-browser compatibility, Fully accessible even when javascript is turned off, as a pure css menu, Search engines optimized, Clear unordered list (LI and UL HTML tags) structure, Easy to setup and update, Fantastic animation and transition effects, Multiple pre-desinded color schemes, Completely customizable styling with CSS, Powered by jQuery,

Extremely small - 3kb uncompressed

More Details

3. Shifty Nav - a Fully Responsive JS CSS3 Mega Menu

featured image

Shifty Nav is a fully responsive CSS3 mega menu. To change the color of the entire menu requires a simple changing of a few pre-defined variables, so there’s not extensive digging through the code!

This menu supports whatever kind of content you throw at it, and includes a full tutorial on how to build the markup for your own menu if you don’t want to modify the pre-existing file.Completely customizable menu layout

More Details

4. Lynx - Responsive Menu

featured image

Lynx is a menu component based in CSS and Javascript code.

More Details

5. Argus - Mega Menu

featured image

This is pure HTML5/CSS3 menu. Menu has HTML5 structure and works on all major browsers. Menu is easy to edit and integrate into any website. On mobile and tablet devices, only the first level of the classic drop-down menu is visible. Menu also comes in two variants (Centered and Full Width). Menu works (the main structure is 100% same) on CSS button style 9, 8, 7… and a lot of old browsers but animation and some other CSS3 features do not work.All images used in the preview are just for demonstration purposes and not included in the Menu.

More Details

6. Smart Responsive Breadcrumbs

featured image

For less than 480px, menu changes from CSS list horizontal navigation menu into vertical and gets hidden behind the menu item.Easy to use builder to test effects and colors

Page with the style and effects builder allows you to see how each effect looks like with different built in color styles.Breadcrumbs are fully responsive, and they will work fine on the small screens (mobile/touch devices) and will turn into menu for easier navigation with a limited space.You can combine different effects to display the menu:

Various demos and examples to show how menu can be set

Style builder for testing each of the styles and effects

Added: New effect for compact menu display

Updated: Demo files, builder and information

More Details

7. Tabion jQuery - Modern Responsive Tab Accordion

featured image

Navion – Metro Navigation Menu Accordion Switcher CSS

OneMenu – Responsive Metro UI Menu

More Details

8. Animated CSS3 Submenu

featured image

This is pure HTML5/CSS3 menu. Menu has HTML5 structure and works on all major browsers. Menu is easy to edit and integrate into any website. Menu works (the main structure is 100% same) on Internet Explorer 9, 8, 7… and a lot of old browsers but animation and some other CSS3 features do not work.

More Details

9. Metro Style CSS3 Menu

featured image

Metro Style CSS3 Menu

A Pure HTML5/CCS3 Metro Style Navigation Menu that fits well with any website or webpage. There are many key features which make this menu look extremely simplistic, yet very complex.

More Details

10. MOBILE.NAV - Responsive menu plugin

featured image

NAV – The easy to use mobile and CSS3 navigation menu plugin for Wordpress

• Integrates with wordpress menu add icon system

• Supports expanding menu tree (from dropdown CSS menu system)

• Installs under Wordpress standard «Settings» menu

More Details

11. Kabude - Responsive Animated Menu

featured image

Kabude – Responsive Animated Menu

Every Menu, An Animated Effect

Negar – Responsive Animated Menu

More Details

12. jElevator jQuery Inter-Page Navigation Tool

featured image

Providing users with scroll-to-top, scroll-to-bottom, and sections menu functionality, jElevator will increase the usability of any page it is added to. As the user’s cursor approaches the left side of the page, a narrow menu will slide into view. This menu may consist of a scroll-to-top button, a scroll-to-bottom button, and/or a sections menu button. The sections menu button will open a secondary pane consisting of a set of links which are generated by the script automatically. Clicking a link within the sections menu pane will scroll the user to the section of the page associated with that link. See the demo for an example that constructs a sections menu from H1, H2, H3, and H4 elements.Auto-Hide Menu

Automatic Sections Menu

More Details

13. Bassema Clean CSS3 Dropdown menu

featured image

More Details

14. Elusive CSS3 Mega Menu

featured image

Elusive CSS3 Mega Menu

A Pure HTML5/CCS3 Mega HTML5 navigation menu that fits well with any website or webpage. There are many key features which make this menu look extremely simplistic, yet very complex.

More Details

15. Narsis CSS3 Glassy Menu

featured image

Narsis Glassy Menu is highly customizable CSS3 animation effects for image hover.These Menu is carefully designed with attention to the details.We use FontAwesome for icons so you can use more than 360 icons for your menu.

More Details

16. Hody - Hidden Simple Menu

featured image

Hody – Hidden Simple Menu

Minimal and creative menu design for your website. The menu has been created for sites of any subject.Multi-Functional Menu

Hidden menu

CSS include 5 color for menu (green,red,blue,yellow,purple)

Simple menu construction

More Details

17. Long Shadow Menu

featured image

Shady is a Responsive, flat long shadow CSS menu.

More Details

18. BETI jQuery - Accordion Menu

featured image

BETI – Accordion Menu

Pofi – Animated Tabs And jQuery slider menu

More Details