首页 声音 项目 正文

35个优秀的jQuery和CSS3导航菜单

作者:TMTForum 时间:2012-08-19 0

导航是网页设计的最重要因素之一。优秀的导航必须兼具美观和实用性。

jQuery和CSS3的信息,你可以很容易地为您的网站导航创造完美功能和定制水平。然而,如果你不熟悉这些,它会变得很困难。幸运的是,人们已经为你写好了代码。

本综述中,我们已经准备了35个新鲜(其中大多数是从2012年开始)美丽并且马上可用的jQuery和CSS3的导航菜单。您需要做的只是为您的特定需求来利用它们!

 

35优秀的jQuery和CSS3的导航菜单:

1. jMenu

JMenu的是一个jQuery插件,使我们能够创造无限的子菜单横向导航。除了jQuery的,它也需要jQuery的用户界面,并支持这个库的所有效果(如淡入或slideDown)。菜单中的标记很干净,因为它使用嵌套列表。

2. Ascensor

ascensor是一个jQuery插件,它旨在培养和适应的内容,根据电梯系统。

3. jQuery Dropdown Login Form

一个简单的jQuery下拉登录形式,很容易实现。

4. HorizontalNav

HorizontalNav 是一个jQuery插件,跨越横向导航,以适应全宽。如果你曾经创建这种效果,你就会知道这是很烦人的。这个插件很容易上手,即使你已经创建了一个效果。

5. jQuery Navigation Plugin

一个简单的jQuery导航插件  “淡出”和“幻灯片”:有两个可能影响至今。

6. Automatic Ajax jQuery Navigation

AJAX导航 的jQuery插件的目标是自动转换成Ajax调用的定期联系,显示链接点击地址栏,改善用户体验感受,使onload和onunload每一页的功能导航有更多的过渡。

7. Kwicks Extended Navigation

kwicks  jQuery的开始做一个Mootools的效果,但现在已经演变成一个高度可定制和通用的部件。

8. CasperJS

CasperJS 是一个开源导航脚本和JavaScript编写基础上PhantomJS -编写脚本的无头WebKit引擎的测试工具。它简化了一个完整的导航方案的过程,提供了高层次的功能,方法和执行常见任务的语法。

9. Bootstrap Image Gallery

引导图片廊 是Twitter的引导工具箱状态对话框的扩展,缓解了一套画廊图像之间的导航。它具有鼠标和键盘导航,过渡效果,全屏模式和幻灯片功能。

10. Flipboard Layout

Flipboard的布局 是一个实验性的页面布局,让你浏览网页。

11. TinyNav

TinyNav.js 是一个微小的jQuery插件(362字节缩小的gzip压缩)转换

      小屏幕选择下拉菜单的导航。它还可以自动选择当前页,并增加了“选择”,该项目。

      12. stack.js

      stack.js 是一个直观的,基于滚动导航演示库。

      13. flexnav

      14. jQuery Keyboard Navigation Plugin

      jQuery的键盘导航插件 提供了通过键盘进行导航和激活,是上,下,左,右箭头键。

      15. Menutron

       

      menutron 是为响应导航菜单的jQuery插件。

      16. jlnav

      17. Simple Responsive jQuery Navigation

      一个框架,是既小又简单易用,  反应(多级)导航的jQuery插件 。

      18. Scrollpath

      scrollpath 是一个自定义的滚动路径插件。它使用帆布味语法来绘制线条和圆弧。

      19. filtrify

      filtrify 是一种先进的标签过滤插件,选出多个选择功能和欧曼克拉克的垂直导航菜单启发。相关标签的项目数量上得到现场反馈。

      20. Curtain.js

      21. PageSlide

      PageSlide 是一个jQuery插件幻灯片网页上揭示了一个额外的互动窗格。

      22. Smooth Div Scroll

      水平滚动的内容向左或向右是一个简单的jQuery插件。

      23. HTML5/CSS3 Gray Navigation Menu

      一个简单的HTML5和CSS3的导航菜单 。

      24. Responsive CSS Navigation Menu

      这个反应的CSS导航菜单 使用了媒体查询,实现了流畅,反应灵敏的设计,很容易适应任何大小的视窗和设备。三种颜色的变化,每个动画悬停样式。

      25. Pro CSS Menu

      CSS菜单 是一个多功能的CSS菜单,准备将自己的设计下跌。在许多不同的配色方案,它也很容易定制几个CSS调整。

      26. Bold CSS3 Navigation

      大胆的CSS3导航, 漂亮的印刷字体和一些非常大胆的色彩组合,是一个现代化的菜单。它有两个版本(横向和纵向)和8个颜色方案,这将使你的页面中脱颖而出。它是简单和很容易使用的。

      27. Modern Vertical Menu

      现代的垂直菜单是导航的两种颜色方案。它可以处理下拉菜单,它使用流畅的幻灯片效果显示出来。

      28. Modern Menu

      现代菜单 设计和开发是一个现代化的,灵活的,易于使用和定制菜单。它是为您的网站使用创造一个完美的快速的动态菜单。

      29. Metro

      地铁受CSS3的新微软地铁UI菜单的启发。它配备了4种不同的“盒子”的布局,图像动画更不错。是很容易的安装和使用。

      30. jQuery jPList Plugin

      jPList  任何HTML结构的排序,分页和过滤(DIV的,符合UL /李,表等)是一个灵活的jQuery插件。

      31. Mega Menu Reloaded

      教程

      1。动画文本和图标菜单与jQuery

       

      本教程将告诉你如何在光滑漂亮的动画上悬挂一个菜单。这样做是为了使一些元素滑出,更改动画项目的背景颜色,然后将元素用不同的颜色表现。

      (2)使用jQuery的动画内容菜单 

      本教程将告诉你如何创建一个漂亮的jQuery的餐厅主题的动画内容菜单。点击动画菜单项,与更多的信息内容区域会出现。此外,背景图片是要根据菜单项被点击时改变。

      3。如何香料你的菜单用CSS3 

      如何用CSS3创建你的菜单:每个菜单项添加一个图像和滑动悬停的快速提示。

      4。与伪元素创建一个黑暗的Web菜单导航 

© 2011 - 2020  钛锋网  TMTForum.com  沪ICP备15013635号