Tagged

菜单

A collection of 12 posts

导航

25个漂亮的导航菜单设计

原文:25个漂亮的导航菜单设计 译自:25 Beautiful Navigation Menus 请尊重版权,转载请注明出处,多谢! 导航菜单是网页设计中最关键的一部分,因为它们对于网站的可用性和用户体验至关重要。导航结构比较烂或者在导航中有明显不足的网站可能会困扰用户并最终导致用户找不到想要的页面和内容而离开。 除了实用性方面,导航菜单也给设计师提供了创造创意的机会。本文中,我们将展示25个使用漂亮菜单的网站。你会看到各种不同的风格,他们或许能为你的设计提供些灵感。 WPZOOM Andy Waldrop Archibald Studio Namesake Designer Themes dfied Ten Little Monkeys Madison Vitamin T Charbon Studio Cornered Toasted Digital Polaroid Bestwork Bully! Entertainment David Hellman Collaborative Fun 3 Sided Cube

导航

40个漂亮的导航菜单设计

导航菜单当然对可用性效果和创建一个用户友好的网站很重要,但是它们同样也提供了添加一些对设计有吸引力的视觉效果的机会。在本文中我们将展示40个有吸引力的导航菜单实例,包括刻钟类型和样式,希望能够给你的设计提供某些灵感。 如果你有或者自己有很好的中文网站设计,欢迎提交至BestCSS。 Utah Travel Lift Interactive MailChimp Idea Foundry The Creative Dot Michael Dick Mission Community Church Sushi & Robots Wonderbra Ultimate Strapless Light CMS Two24 Studios Typejockeys Ecosimply Glue Adcetera Digital LogoCranium Matty Studios Design Bridge Robert Alan Toggle Southern Media Delete Powerful CMS

导航

30个很棒的水平导航菜单欣赏

**原文:**[30个很棒的水平导航菜单欣赏](http://www.qianduan.net/30-gorgeous-horizontal-menus.html) **译自:**[30 Gorgeous Horizontal Menus for Inspiration](http://www.queness.com/post/744/30-gorgeous-horizontal-menus-for-inspiration) 版权所有,转载请注明出处,多谢!- - - - - - 设计一个独特而有吸引力的网站导航从来不是件容易的事情。在本文中,我们收集了30个有灵感且漂亮的水平菜单,我相信它们可以给你的网站设计一些想法~~ Get me fast Jobs on the Wall Kayak Capers Bazar solidale Impaled Existence The Creative

菜单

30个很棒的下拉菜单和滑动菜单设计实例

每当为客户做网站的时候,我就不得不折腾一个水平菜单中的二级导航的最佳显示方式(而且不要让它看起来像10年前那样),然后我就开始去寻找一些灵感。我找到了很多网站,它们使用下拉菜单或滑动菜单,而且我想,你也可能会对我找到的这些实例感兴趣吧。 请告诉我你是如何看待这些菜单设计的,他们是好还是坏,有哪些优点或者缺点,或者,你发现了还有很多很棒的中文网站的菜单设计,请在评论中写出来,这样,对我,对大家都会有所帮助的:) Carreras Con Futuro Apple Reviews Archer Group Energy Cell Artkasa Bnet BuySellAds Ink’d Daily RT Designers Couch Design Slurp Behance Network EctoMachine Exposition Universelle Des Vins & Spiritueux Explovent Hungry For Change

jquery

10个jquery动画菜单:插件和教程

jquery是一个非常容易使用,同时也是扩展性很好的一个javascript框架。使用jquery可以非常容易的实现一些页面的ajax效果。本文收集一批使用jquery实现很酷的动画效果菜单的插件和教程。 插件 LavaLamp 相信很多人都见过这个很酷的菜单插件,也有很多网站成功的应用了这个插件。 插件主页 jquery Kwicks 插件 如果你多Mootools有些了解,或许会注意到Mootools上一版主页的一个滑动菜单效果(现在已经看不到了)。这个插件就是来自于这个效果,很酷,也很容易定制。使用这个插件不仅仅可以制作非常个性的菜单,制作某些步骤演示也非常合适——比如购物流程的演示。插件主页 查看演示 | 下载 仿Mac的停靠菜单插件 这是个仿苹果机的停靠菜单的一个jQuery插件,支持水平和竖直两种。查看插件页面。 查看演示 | 下载 jquery滑动菜单 一个和LavaLamp很像的菜单,而且脚本只有不到1kb(lavalamp也是这么小),也比较容易使用。该菜单的原理是,通过在当前ul元素的下面(或者说”后面”更合适些?)添加一个额外的div,用position定位该div。然后用jquery和插件来控制这个div的大小和位置,并实现动画效果。 查看演示 | 下载 教程 CSS Sprites2 – 使用jquery制作动画菜单

下拉

25个很不错的下拉菜单脚本收集

译自:http://vandelaydesign.com/ 原文:25个很不错的下拉菜单脚本收集 版权所有,转载请注明出处,多谢! 导航菜单对每一个网站来说都很重要。设计良好的网站能够提高网站的视觉效果和体验,就像可用性。对于大型网站来说,一般都有很多内容或页面,这个时候,下拉菜单就被广泛使用了,因为它们能够让站内不同页面之间的跳转变得更加轻松。在本文中,我们收集了25个下拉菜单脚本,当然这些菜单可能不够漂亮,但是你可以完全通过CSS来将其整合入自己的网站或应用中去。 1.jQuery Multi Level CSS Menu #1 2.jQuery Multi Level CSS Menu #2 3.All Levels Navigation Menu 4.Smooth Navigation Menu 5.Simple CSS Vertical Menu Digg-Like

图标

创建带有图标的导航菜单

在我创建的每一个互联网应用中,我都试图避免创建完全由图片组成的菜单。在我看来,菜单系统中应该使用文字。这样做也会让菜单变得更干净利落、清晰和易读,不用考虑应用程序如何读取它,以及页面放大的时候也不会失真等。或许这只是我的想法?但是我们不能创建即好看又好用的菜单吗? 下面是创建下面的有图标支持的导航菜单的代码和样式。 点击这里 查看演示(在新窗口中打开). 基本标签 home about work The CSS /* style.css */ .nav {width:550px; height:50px; padding:0px 25px; margin:0px; background:url(img/bg.gif) repeat-x; border:1px solid #efefef;} .nav li {float:left; width:125px; height:50px;

导航

25个创新和有创意的导航菜单设计

这是webAir收集的25个非常棒的导航菜单设计,包括侧栏导航、水平导航、垂直导航和一些实验性的效果很炫的导航设计,很值得参考! 侧栏导航菜单 GABBO DESIGN 特色: 简洁、干净 gabbo.cz/graficke-studio.html Concentric Studio 特色: 滑动菜单(JS powered) concentric-studio.com/work/dealbreaker/?nav=2 Ruby Tuesday 特色: 简单的文字+图片 rubytuesday.com/ District Solutions 特色: 极简的垂直tab districtsolutions.co.uk/candidates/ 水平导航菜单 CodeGreene 特色: 圆角tabs + 阴影效果 codegreene.com TwitterLane

导航

一个无限级别导航菜单【推荐】

无限级导航菜单(All Levels Navigational Menu (v2.1))是一个基于CSS/HTML的列表,它支持无限级子菜单。此菜单小巧且易用(菜单代码是简单的HTML列表),而且所有的菜单的链接对搜索引擎友好。此外,这个菜单以一定的方式结构化,所以它很容易被定制外观。 菜单支持水平导航和垂直导航两种方式,官方提供了很多的模板供参考和快速上手。 访问官网网站>> 下载(仅包括两个简单的演示,了解更多请查看官方网站)

Tips

免费CSS多级下拉菜单框架

一个很棒的跨浏览器的基于CSS的下拉菜单框架,而且基于模块化和模板化,很容易上手,据作者讲,自己开发一套模板只需10几分钟就可以搞定。 这里包含了比较多的模板,有水平菜单,也有垂直菜单,当然都是多级菜单。 用到了jQuery的JS框架,但是只是少量的,而且这些框架是为了应付IE6之前版本浏览器的。 地址:http://www.lwis.net/free-css-drop-down-menu/