The script is a complex jQuery elegant Glyph drop-down Menu (horizontal and vertical) with huge possibilities for any project. Easy to use.
In this tutorial, I’ll show you how to create a simple ribbon dropdown menu using CSS3 and jQuery. The menu is cross-browser compatible so it will be easy for you to adapt in your project. And to spice up a little bit the menu, I used the superfish javascript class and “Oswald” font from Google fonts library.
In the downloaded archive you’ll also have acces to the PSD file, in case you need to change the design. Let’s see now how the CSS3 dropdown menu was done.
SelectNav.js is a JavaScript plugin that lets you convert your website navigation into a select drop-down menu. Used together with media queries it helps you to create a space saving, responsive navigation for small screen devices.SelectNav.js adds a js class to the html element. Thanks to this, when JavaScript is disabled the default navigation will be visible. Selectnav.js works with every navigation in form of ul or ol lists that follow the example above.
One of the common challenges when designing responsive design for mobile is the navigation menu. If the site has many sections or pages, it gets challenging to squeeze all the items into a small mobile resolution. The navigation most likely ends up running into multiple lines or the buttons stacking on top each other. So I’m going to review some of the design solution and provide a quick tutorial on how to create a mobile navigation with jQuery.
A free light weight jQuery plugin that allows you to create a custom drop down with images and description.
What is so cool about this plugin!
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 today I wanted to take a crack at recreating the Apple navigation using CSS3 techniques.
I wanted to keep it very light weight and semantic. Using an unordered list is fairly standard for a navigation system and I’m not really breaking new ground here.
The animated button & menu jQuery plugin allows you to easily replace <a> links with animated buttons and grouping buttons into a menu.
Features:
A simple navigation menu that “follows” page scrolling and expands on mouse over, made with css and jquery.
A fixed table of contents drop-down menu jQuery plugin. It’s a one-page site that uses a fixed drop-down menu at the top of the screen that collapses/expands in a “table of contents” style.
Here is a simple jQuery plugin I wrote recently which allows you to create a simple drop down menu, utilising hoverIntent, and jQuery’s own slideUp and slideDown effects. You can also set the orientation of the drop down depending if your navigation is horizontal (default) or vertical, and set the duration and easing method of both slideUp and slideDown on initiation of the plugin.
