Menus are an integral part of a website, a site with good menu structure always has greater pageviews due to the accessibilty of the site. Menus should be visually appealing and should appeal users to browse through them. In this post i have tried to make a list of such menus so that you can use them on your next project or on your site. Some of them are simple old menus implemented differently and many are also tutorials, get inspiration or simply copy paste code and create your menu.
1) FG jQuery Menu – This menu comes with various attractive styles such as Dropdown, iPod Drilldown, and Flyout styles, it looks really fantastic and attractive. The menu has ARIA Support and Theme Roller ready and can be easily edited to suit your needs. The i-pod style menu with breadcrump works like deviantart menus.This is a sure check for those who wants dropdown style menus.
2) Vimeo-like Top Navigation – Anather awesome looking menu inspired from vimeo, with hover dropdown and search box. Extremely useful for catagorising search. The menu is fully based on CSS so is of very small size. Extemely easy and very much flexible.
3) Circular Menu – A really unique type of menu, and even have submenu support, may be used in portfolio sites. Created solely using CSS looks very cool. This one’s a check if you wan’t to learn CSS and know its power, or if you like to integrate it.
4) Sexy Sliding Menu – Andrew Sellick decided to use mootool and create a good looking sliding menu which can save space problem and well as look attractive. He pretty much succeded though it has some pitfalls such as CSS issues in safari, more over in my test in firefox it did work inconsistently, but maybe someone can fix it and its a good example so i’ll keep it in this list.
5) MenuMatic - This is a awesome menu developed by greengecko design, It uses mootools 1.2 class and uses semantic odered or unodered list and turns them into menu. The best of all its SEO friendly, Stylish and Flexible. This menu can be used in two ways horizontally or vertically. The menu is extremely smooth and slight transparent giving it a very cool look.
6) Lwis Dropdown Menu Framework - Highly recommended for new learners, the framework is total CSS and modular, the cdes are easily deployable and can be transferred into horizontal, vertical left-to-right, vertical right-to-left, horizontal linear. It has cross browser support but has minimal javascript for IE and ofcourse superfast. I has some inbuilt templates which mimics various big sites such as Adobe, Flickr, Nvidia etc.
7) Web 2.0 Dock Menu – Web 2.0 dock menu by 2210 media is derived from whalesalad.com, the menu pops up when ever the mouse hovers on a particular area in header and goes away on mouse out, the animation is smooth and fast and is majorly supported by browsers. The menu it self looks cool and though not totally web 2.0 but its elegant with its transparency.
CSS Dock Menu – Though the name is CSS Dock but it actively dependant on jQuery. This ones my personal favourite and i’m sure all mac fans out there will like it. It comes with 2 dock styles top and bottom. I don’t know how feasable it is for using in regular sites but its very good thing to study.
9) CSS Sprites 2 - This is a tutorial on using jQuery to built sprite type menus in normal CSS, Javascript instead of Flash. The tutorial is really good and shows you all steps in creating the menu. The menu example shown is really cool and worth looking to it.
10) jQuery Animated Navigation - This tutorial and source is brought by nettuts which has numerous high quality tutorials under its hoods. This tutorial shows a really cool navigation created by jQuery and CSS, ditching Flash which was almost a nomenclature for cool menus for few years ago.
11) Lava Lamp – Lava Lamp by ganesh is yet anather jquery menu, with cool sliding effect in the background, i have seen many versions of this menu in different sites and they were implemented really cool ways. So this is a must addition here. Moreover the menyu script is just 1KB in size !!
12) Phat Fusion Image Menu – The name suggests its not regular menu but an image menu, this is really cool way of interacting with visitors. The menu have been constructed using mootools javascript framework. The images cooly reveals more of it when mouse is hovered over it. It stays open when clicked. Great example of mootools implementation.
13) Simple Animated Mootools Menu – Consideropen.com published a tutorial on how to simply create the menu they have on their site using mootools. The arrow on top of their menu slides from one option to another when mouse id hovered over it. The implemented menu looks really cool and you should have a look at it.
14) Advanced CSS Menu – This one is a great example of using CSS to create advanced menu. The tutorials talks about slicing and the menu design and putting together in css to craete a great effect. This is a must check.
15) UvamiTools Dropdown Menu – This is another mootools menu built from unodered list, it has multilevel support. The menu is cross browser compatible and Customisable in CSS.
16) Ext JS Tree Panel – This is an excellent Javascript menu with drag and drop capabilities. The tree is asynchronously loaded with a JSON TreeLoader.
17) Apple Style Menu – This is an improved version of apple inspired menu using jQuery. The menu looks really cool the tutorial teaches creating the menu from scratch starting from photoshop.
18) Hover Box – The menu was inspired from Hoverbox Image Gallery developed by Nathan Smith, the basic concept of the menu is that it gets bigger when anyne hovers on it. Created purely by CSS, though it doesn’t look cool, but i’m sure graphic designers out there can easily modify to suit their needs and looks.
19) Styled Menus – A Depot of highquality CSS Menus.
20) Dynamic Drive – Practical CSS codes and examples such as CSS menus.
22) 13 Styles – Free CSS Menu Download
facebook
Bebo
Twitter us
evernote
linkedin
Yahoo
delicious
mixx
Google
digg
technorati
Stumble Upon
reddit
my space
windows Live
Click here to send to a friend!
Post a Comment