菜单导航对于一个网站来说非常重要，对于浏览者来说，导航设计的好坏将直接影响用户的体验。这里，我们为网页开发者提供了一系列简单但是实用的导航菜单例子及其源码，仅供参考和学习。
CSS3相关的导航
这是一款灰色风格的导航，具有水平和垂直的形式，这个导航是由CSS3实现的，所以需要用支持CSS3的浏览器来查看。你可以通过自己修改CSS代码轻松实现漂亮的水平导航和垂直导航。
这是一款纯CSS3制作的导航菜单，这个银白色的菜单在朦胧夜空的衬托下显得格外亮丽。当鼠标滑过导航时，每个菜单项又会呈现不同的效果，整体上，这款CSS3导航菜单非常简单而又具有立体感。
3、jQuery+CSS3图片特效导航菜单jSlickmenu
jSlickmenu是一款基于jQuery和CSS3的导航菜单，该菜单的特点是利用旋转和带阴影的图片作为导航项，当鼠标移到导航时，相应的图片高亮显示。这款图片导航由于利用了CSS3特性，所以外观非常cool。
这是一款用纯CSS3实现的仿Win 7的开始菜单。如果我们分解这个Windows 7开始菜单，我们会得到1个div，2个ul列表，1组链接以及一些icon小图标，我们可以一起来看看具体的效果。
普通JS和CSS导航
这是一款用jQuery实现的仿苹果的导航菜单，该导航菜单随着鼠标的滑过呈现出图标缩放的效果，就像苹果系统中的Dock Menu一样。
6、仿猪八戒导航菜单
这是国内最大威客网站猪八戒网在2010年前的网站主导航，该导航主要由CSS和图片制作完成，导航以蓝色为主色，橘黄色Tab为辅色，整体简洁大方。
这是一款基于jQuery的下拉垂直导航菜单，该垂直导航菜单可以展开和收缩每个菜单项，并在展开和收缩菜单的同时带有奇妙的弹性效果。由于这个垂直导航菜单是完全基于jQuery的，所以可以兼容所有的浏览器。
这是一款仿支付宝的产品推广导航，支持两屏切换，非常适合给产品宣传类网站作导航。因为这个导航是以图标结合文字的，所以非常直观并且十分精美，导航最大的目的是让用户更好的在站内畅行，这个导航就非常好的满足了这一点。
向大家介绍一款基于jQuery和CSS的漂亮导航，该jQuery导航共有6种颜色皮肤。鼠标滑过导航时，导航边缘发出光亮，并有动画效果。而且该导航还有多级菜单的功能。
ddsmoothmenu是一款基于jQuery的多级菜单导航插件，你可以任意指定多级菜单项。同时，ddsmoothmenu还支持水平菜单和垂直菜单的功能。菜单带有阴影效果，简单而漂亮。ddsmoothmenu全称Smooth Navigational Menu。
11、jQuery右键菜单插件jQuery ContextMenu
jQuery ContextMenu是一款功能强大的网页右键菜单插件，该插件将帮你非常方便地创建右键菜单。你可以指定右击的位置，同时菜单中还可以定单选框和多选框的复合控件，定制非常灵活。
jStackmenu是一款基于jQuery的堆栈式动画菜单，当你用鼠标点击那个“爱心”按钮时，jStackmenu菜单就会以堆栈方式弹出或者收拢，并呈现出流畅的动画特效。
原文链接：http://www.cnblogs.com/cnhtml5/archive/2012/06/13/2548664.html
【编辑推荐】
