jQuery is a lightweight, cross-browser compliant, incredibly awesome and extremely powerful JavaScript framework (library) that emphasizes interaction between JavaScript, CSS and HTML. With jQuery, you can change the look and feel of your website into something extraordinary and it is easier than you think. This way you are providing a different and very dynamic look and feel that users will typically love.
jQuery can allow for an enhanced user experience in a variety of ways, from image sliders and lightboxes, to tooltips, navigation menus and contact forms. When combined with other upcoming technologies like HTML5 and CSS3, the possibilities are nearly limitless.
Navigation is one of the most important elements in web design. It has to be neat, usable and creative at the same time in order to not scare your visitors away. jQuery is one of the most powerful tools to enhance your navigation and make it stand out. With jQuery you can bring together both the creative and usable. This post will roundup 40 fresh and superb jQuery plugins that will make your menus look awesome. With jQuery, you could make your website’s navigation look a simply stunning one! feel free to comment if i missed out some.
1. Mac Style Dock Menu in jQuery and CSS
If you are a big Mac fan, you will love this CSS dock menu. It is usingJquery library and Fisheye component from Interface and some of myicons. It comes with two dock position: top and bottom. This CSS dock menu is perfect to add on to my iTheme. Here I will show you how to implement it to your web page.
2. MooTools Homepage Effect using jQuery
As you know there are a host of competing javascript libraries around these days. Though I prefer jQuery, I’ve always liked the way the menu on MooTools worked
3. Lavalamp
Lavalamp is a simple, ready to use JQuery plugin which allow you to create a stunning effect over your horizontal navigation bars. Nice to see, easy to implement.
4. jQCloud
jQCloud allows you to build neat cloud-shaped word clouds and tag clouds. Since this plugin produces pure HTML code, the word cloud layout can be easily personalized with custom CSS styles.
5. Superfish รข€“ jQuery menu plugin
Superfish is a JQuery plugin especially dedicated to menus. It allows many improvement from what you can achieve with HTML and CSS as such as hover support for IE6, animations, keyboard accessibility and more.
6. OS X Finder-like ColumnView
This is a jQuery (1.4 as of writing) extension for mimicing the OSX Finder column behavior. You specify an initial element: $(‘#columnview’).columnview(); And the plugin takes the contents of that node and places it in the first ‘column’
7. vertical sliding JQuery menu
Your clients will love it, there’s no doubt about it. And even better, the tutorial will also teach you how to design that kind of menu using Photoshop.
8. jQuery for Background Image Animations
jQuery is a great library for this type of task but out of the box, it can’t animate background position properly because of the need to animate two values instead of just one (too bad not all browsers implemented the non-standard background-position-x and -y like Internet Explorer).
9. Puffer Fish Navigation
Rollover navigation with a glow
10. Accordion Menu using jQuery
11. jQuery Context Menu
ContextMenu is a lightweight jQuery plugin that lets you selectively override the browser’s right-click menu with a custom one of your own.
12. jQuery Menu Selector
This plugin makes menu items active by location path.
13. Slide Down Menu
The idea is to make a box with a menu item that slides out, while a thumbnail pops up. We will also include a submenu box with further links for some of the menu items. The submenu will slide to the left or to the right depending on which menu item we are hovering.
14. Apple style Navigation with CSS3 JQuery
Apple is known for very clean design and if you have been to their website in the last few years you’ve seen their primary navigation. It’s a staple of the Apple website and this plugin recreates Apple’s navigation using CSS3 and jQuery.
15. Smart Cart 2 – jQuery Sopping Crt Pug-in
It is very easy to implement and only minimal HTML required in smartcart. The selected items in the cart are accessible as an array of product/quantity pair delimited with ‘|’ on submit form or when checkout event is triggered. Smart Cart 2 have a simple and compact design with tabbed interface to save space.
16. Easyrpc
This is a synchronous and an asynchronous library to communicate with a server application with almost zero configuration.
17. Ninja UI
Ninja user interface is skilled in the techniques of JavaScript and CSS, going unnoticed until called upon to perform the arts of webjutsu.
18. jxSlider
jxSlider widget turns the selected DIV into a small embedded ajax tabbed-navigator. The ajax-loaded content will automatically and recursively be shown into the initial DIV.
19. Image Hover Move
A simple and practical navigation or featured image jQuery plugin.
20. jQuery Scroller
With jQuery Scroller you can create easily smart scrolling text, news ticker, or image animations with few lines of code in jQuery!
21. jQuery One Page Navigation Plugin
With this plugin you’ll make the page scroll smoothly when the navigation is clicked. It also automatically highlights the correct navigation section depending upon which section is scrolled to.
22. jCrumb
JCrumb is a JQuery plugin for instantly adding breadcrumbs to any webpage without the need to worry about sitemaps, or server side languages.
23. Autobrowse Endless Scroller
When run on a DOM element, this plugin will make the element grow and fill its content automatically when the user scrolls to the bottom of the element. The content is fetched via ajax, and the plugin keeps a cache using local storage.
24. WZSplitter
WZSplitter is a flexible, easy to use layout plugin. It helps end users to set up any combination of resizable panels just by providing a few configuration values.
25. iX Framework
iX Framework is a javascript GUI / Javascript Widget consist of comprehensive components, such as : Grid, Chart, Tree, Window, Panel, Field, Validation, Combo and more.iX Framework is a comprehensive, powerful and affordable professional web framework that remove the boundary between web and desktop application.
26. Subway Map Visualization jQuery Plugin
This plugin renders unordered lists into a subway map similar in style to the London Underground map. It emphasizes a clean, aesthetic look with curves and proper placement of markers for stations and interchanges.
27. Memu – A simple CSS / JavaScript / JQuery Menu
A small, solid jQuery plugin which is quite easy to use. It’s a menu which can be used with or without JQuery. What’s special about this script is the included plugin jstorage.js (which is some amazing work btw) to store the current item. So if you’re navigating around, the selected item will stay highlighted. This will spare you some server-side code. You can try this one by clicking on the menu item “File -> New”.
28. Dropp
Dropp is a jQuery plugin which replaces regular dropdown menus (
