30+ Essential Javascript Framework Supported Navigation Techniques
Navigation is key to any web site or blog. Good and user friendly navigation making it easy for your visitors to get around fast is simply one of the most elemental elements of web design and development.
Professional dropdown #2
Good looking menu but it is unclear if it is still maintained. Tested in IE5.5, IE6, IE7, Firefox, Opera, Netscape, Mozilla, Safari (PC) and Safari (iPod Touch). Testing in recent browser versions is recommended before using it. A donation for use of this menu is required. Visit stunicholls.com where you find more than 30 great menu scripts.
Professional slide drop #1
Simple drop down menu that has a vertical sliding action. Hover over a top level link to slide down the submenu, and it does slide down, not just appear using a vertical shutter action, and then hover over the same top level to close or another top level to open that one and close the previous one. You can run your mouse over the top level items to open and close them and they will all work simultaneously.
This uses a simple javascript routine to read the mouse hovers and slide the sub menu list either up or down depending on the current state of the sub menu.
Tested in IE6, IE7, Firefox, Opera and Safari (PC).
List Based Menu with Images
This is a menu based on an unordered list (<UL><LI>). It makes the menu easy to use and friendly to search engines.
Unlimited Drop Menu
CSS Express Drop-Down Menus
CSS Express menus should only be used in a horizontal orientation with a single drop-down level.
Chrome CSS Drop Down Menu
Chrome Menu is a CSS and JavaScript hybrid drop down menu. It’s easy to configure and search engine friendly.
Create a multilevel Dropdown menu with CSS and improve it via jQuery
The first part of this tutorial is dedicated to the task of building a working CSS-only dropdown menu (also known as suckerfish menu), the second part will show you how you can pimp the whole thing with a few lines of jQuery.
Drop Line Menus
Professional dropline #5
This Dropline menu uses hover instead of click to open (and keep) open a sub menu. With the top level and the dropline centered within the containing div. Using hovers instead of click will allow the top levels to have links.
Just hover over a top level item to drop down the associated sub line. The top level will stay black to show that it has been selected. Hover the same item to close the sub list or a different top level item to close the current sub level and open a new one. ‘Home’ and ‘Privacy policy’ do not have sub levels.
The ability to have a selected top level open on page entry is included, which is demonstrated in this menu where ‘Sales’ is selected on page entry (demo).
Tested in IE6, IE7, Firefox, Opera and Safari (PC). Visit stunicholls.com where you find more than 30 great menu scripts.
Other Nice Dropliners.
jQuery – dropline with current selection
A dropline menu with the ability to set the ‘current’ page and have the menu open with this highlighted. If you hover over any of the other menu options then the current trail is removed and the new trail displayed. Once you move the mouse ff the menu then the current seletion will re-appear.
This script makes minimal use of jQuery to control the display of the droplines and is styled using CSS.
All browsers except IE6 have an opaque background to the droplines. Tested in IE6, IE7, Firefox, Opera, Safari (PC) and Google Chrome.
A donation for use of this menu is required.