70+漂亮且极具亲和力的导航菜单设计国外网站推荐


Posted in Javascript onSeptember 20, 2011

导航菜单应当足够简单以让用户快速了解它,但还要包含一些必要的元素来引导用户浏览整个网站——融入一些有创意且漂亮的设计。

向大家推荐的70款优秀的导航菜单,有些是基于CSS设计的,有些是基于CSS+JavaScript的菜单,还有些是基于Flash的导航菜单设计,它们都有一个共同点:那就是它们都极具创意、界面对用户有好的,且完美的与网站的整体风格融合在一起。

1.基于CSS的导航菜单设计

Loodo
让网站更有感觉的华丽的菜单

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Acko.net
Steven将他网站的导航菜单设计成了不同寻常的透视效果。

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Web Design Ledger
Web Design Ledger的导航菜单设计的非常棒,超大的尺寸让用户的操作很方便,但不会干扰到网站的内容。

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

UX Booth
UX Booth在它的导航下面使用了华丽的文本区,用来对每个相应的导航菜单项进行详细描述。

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Nopokographics
很少有网站使用纵向的导航,原因很简单:纵向菜单用起来很困难。但是,仍然会有一些设计师铤而走险。 Nopoko Graphics 为纵向导航添加了箭头和一些鼠标悬停效果。

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Icon Designer
这个网站在首页使用了一个很大的基于图片的导航。用户的视线会第一时间被这个大导航吸引,从而起到方便用户的作用。

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Cosmicsoda
这个网站的大导航很吸引人,而且使用了轻微的悬停效果来着重显示某个菜单项。

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Designsensory
这个二级下拉式导航菜单,通过不同的颜色来凸显当前激活的菜单项。

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Smallstone
Smallstone,一家美国唱片公司。导航的设计样式是号称Space Echo Roland SE-201。

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

TNVacation
这是个非常难得的养眼的下拉菜单,的确非常漂亮!

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Clearleft
Clearleft用几张纸组成了它的导航菜单。

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

45royale
带有漂亮的鼠标悬停效果的简洁导航。

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Design Intellection

70+漂亮且极具亲和力的导航菜单设计国外网站推荐
Ronnypries.de

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Jiri Tvrdek

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Water's Edge Media

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Matt Dempsey

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Cognigen

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

District Solutions

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Jayme Blackmon

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Jeff Sarmiento

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Studioracket

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Cultured Code

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Nando Designer

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Bonfiremedia

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Artgeex

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Gloobs

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

South Creative

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Mac Rabbit

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

RapidWeaver

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

DFW UPA

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Revolution Driving Tuition

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Duarte Pires

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Valetin Agachi

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Tutorial9

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

2. 带有JavaScript的CSS菜单

Agami Creative

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Whitehouse.gov

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

AppStorm

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Eric Johansson

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Coda

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Dragon Interactive

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Bern

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Abduzeedo

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

3. 基于Flash的菜单

Iipvapi

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Not Forgotten: The Movie

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Nick Tones

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

woonky.ideas

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Gotmilk

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Spectra Visual Newsreader

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

NickAD

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Sensi Soft

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

4. 高可用性的导航菜单

tap tap tap

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Apple

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Alex Buga

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

CREASENSO

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

polargold

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Colourpixel

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

DVEIN

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Alexandru Cohaniuc

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Porsche Canada

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Jeremy Levine Design

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

firstborn

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Benjamin David

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Thibaud's Portfolio

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Jason Reed Web Design

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Marius Roosendaal

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

5.纵向导航布局

Danny Blackman

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Tomas Pojeta

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

volll

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Mediocore

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

6.对用户友好的侧边栏菜单

FreelanceSwitch

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Fubiz

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Checkout

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Ruby Tuesday

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Concentric Studio

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Barack Obama

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

GABBO DESIGN

70+漂亮且极具亲和力的导航菜单设计国外网站推荐

Javascript 相关文章推荐
js 分页全选或反选标识实现代码
Aug 09 Javascript
JavaScript高级程序设计阅读笔记(六) ECMAScript中的运算符(二)
Feb 27 Javascript
js捕获鼠标滚轮事件代码
Dec 16 Javascript
js实现当前输入框高亮显示的方法
Aug 19 Javascript
浅谈String.valueOf()方法的使用
Jun 06 Javascript
AngularJS延迟加载html template
Jul 27 Javascript
微信小程序 引入es6 promise
Apr 12 Javascript
JS非行间样式获取函数的实例代码
Jun 05 Javascript
vue 自定义指令自动获取文本框焦点的方法
Aug 25 Javascript
如何为你的JavaScript代码日志着色详解
Apr 08 Javascript
使用异步组件优化Vue应用程序的性能
Apr 28 Javascript
JS实现电脑虚拟键盘的操作
Jun 24 Javascript
JavaScript高级程序设计 学习笔记 js高级技巧
Sep 20 #Javascript
跨浏览器通用、可重用的选项卡tab切换js代码
Sep 20 #Javascript
JQuyer $.post 与 $.ajax 访问WCF ajax service 时的问题需要注意的地方
Sep 20 #Javascript
简单的jquery拖拽排序效果实现代码
Sep 20 #Javascript
用jQuery中的ajax分页实现代码
Sep 20 #Javascript
jquery模拟按下回车实现代码
Sep 20 #Javascript
一个分享按钮的插件使用介绍(可扩展,内附开发制作流程)
Sep 19 #Javascript
You might like
PHP中文编码小技巧
2014/12/25 PHP
PHP实现对文件锁进行加锁、解锁操作的方法
2017/07/04 PHP
实例分析10个PHP常见安全问题
2019/07/09 PHP
最新的10款jQuery内容滑块插件分享
2011/09/18 Javascript
密码框显示提示文字jquery示例
2013/08/29 Javascript
JavaScript中将数组进行合并的基本方法讲解
2016/03/07 Javascript
关于JS中setTimeout()无法调用带参函数问题的解决方法
2016/06/21 Javascript
微信小程序 加载 app-service.js 错误解决方法
2016/10/12 Javascript
AngularJS 与百度地图的结合实例
2016/10/20 Javascript
angular ngClick阻止冒泡使用默认行为的方法
2016/11/03 Javascript
jQuery中$.grep() 过滤函数 数组过滤
2016/11/22 Javascript
Bootstrap框架实现广告轮播效果
2016/11/28 Javascript
redux-saga 初识和使用
2018/03/10 Javascript
从零开始用electron手撸一个截屏工具的示例代码
2018/10/10 Javascript
微信小程序实现笑脸评分功能
2018/11/03 Javascript
node+multer实现图片上传的示例代码
2020/02/18 Javascript
JavaScript实现手风琴效果
2021/02/18 Javascript
wtfPython—Python中一组有趣微妙的代码【收藏】
2018/08/31 Python
Python中的取模运算方法
2018/11/10 Python
对pandas读取中文unicode的csv和添加行标题的方法详解
2018/12/12 Python
python 对字典按照value进行排序的方法
2019/05/09 Python
Numpy的简单用法小结
2019/08/28 Python
TensorFlow dataset.shuffle、batch、repeat的使用详解
2020/01/21 Python
Python基于yield遍历多个可迭代对象
2020/03/12 Python
世界最大的私人旅行指南出版商:孤独星球
2016/08/23 全球购物
美国农场鲜花速递:The Bouqs
2018/07/13 全球购物
俄罗斯小米家用电器、电子产品和智能家居商店:Poood.ru
2020/04/03 全球购物
中专毕业生自我鉴定范文
2013/11/09 职场文书
办理退休介绍信
2014/01/09 职场文书
毕业评语大全
2014/05/04 职场文书
禁毒宣传活动总结
2014/08/26 职场文书
幼儿园五一劳动节活动总结
2015/02/09 职场文书
小学六年级班主任工作经验交流材料
2015/11/02 职场文书
2016读书月活动心得体会
2016/01/14 职场文书
浅谈Redis存储数据类型及存取值方法
2021/05/08 Redis
Python查找算法的实现 (线性、二分,分块、插值查找算法)
2022/04/24 Python