应用jQuery菜单插件可以让浏览者在浏览你的网页时获得最好的动态导航。jQuery是一个轻量级、跨浏览器的JavaScript框架(库),效果非常给力,它强调并简化了JavaScript、CSS和HTML之间的交互过程。

使用jQuery,你可以改变网站的外观,使其看起来更加出众,并且容易程度远超你的想象。在这里,你可以提供动态的而且观感非常与众不同的界面,这种界面很受浏览者的欢迎。导航栏作为网页设计的最重要的部件之一,需要非常简洁可用,并且同时也富有创造性,以免使用者因为找不到所要找的按钮而离开。

jQuery是提高网页导航质量的有力工具,这篇文章将会综合介绍一些最新、最酷的jQuery菜单插件,这些插件可以让你的网页看上去更炫。如果我有所遗漏,请在评论中补充。另外,也请关注jQuery的其他特性和插件,比如jQuery的图片缩放。我们最近更新了这篇关于jQuery的文章,并且删掉了坏链。

如何使用jQuery菜单插件?

Mac Style Dock Menu in jQuery and CSS – MORE INFO / DEMO

如果你是苹果粉,你一定会喜欢CSS的停驻菜单。 It comes with two dock position: top and bottom.

MetroPanel – The New Navigator for Modern Sites – MORE INFO / DEMO

With the division into two panels and a large number of backgrounds and items, you have an infinite number of ways to adapt the menu with this plugin.

Mega Menu Complete Set – MORE INFO / DEMO

This Mega Drop Down Menu Complete Set is perfect for creating unique jquery navigation menu by using one of the 10+ jQuery effects and one of the 13 color variants. Based on a custom grid, this menu allows you to organize your content into columns (from 1 up to 12) with a lot of typography examples such as headings, lists, images styling, tables, form elements, etc.

Fullscreen Site Navigation – MORE INFO / DEMO

This JavaScript plugin lets you build a fullscreen website the quick and easy way. It can be integrated into any cms or website template: it provides only the structure and the algorithm to make it work, the rest is on the designer’s hand.

Metro Flexible Navigation – MORE INFO / DEMO

The Metro Flexible Navigation is a simple, clean grid layout looking a lot like the new Windows 8 interface. It can be customized to be laid out horizontally or vertically. It’s scrollable and drag-able at the same time and contains useful sliding controls. Icons can be changed, there is a large collection available.

UI-Pro – Simple Metro Style Navigation Bar – MORE INFO / DEMO

With this simple jQuery Plugin you can easily create Metro (now simply called Windows 8 UI) style navigation bars. The plugin package comes with the icon pack called iconic created by P.J. Onori, which you can easily set with CSS classes.

Quick & Pro Menu – MORE INFO / DEMO

Quick & Pro Menu creates a special style of jQuery mega menus which is only seldom seen in Websites but really cool for giving visitors quick access to a lot of information.

Tabs + Accordion – MORE INFO / DEMO

This a jQuery plugin that simplifies creating responsive tabs and accordions. You can either use one of the included themes or create your own, by picking the colors yourself.

Superfish jQuery menu plugin – MORE INFO / DEMO

Superfish is a JQuery plugin especially dedicated to menus. It allows many improvement from what you can achieve with HTML and CSS as such as hover support for IE6, animations, keyboard accessibility and more.

Smooth Expandable Menu – MORE INFO / DEMO

Smooth Expandable Menu is the definitive tool for building minimal vertical expandable menus, which can be easily customized due to its 17 built-in configuration parameters, directly from the html file / script call. The pack includes 3 samples (Serif, San Serif and Tiny), to make easier the integration on any web project.

Menu Maker CSS3 jQuery – MORE INFO / DEMO

This is a JavaScript code that gives you a friendly tools of making a navigation Menu bar with a rounded corner and a smooth animation for search input box. Making navigation menu was never been so easy. All you got to do is dragging the slider bars to change the menu properties.

jQuery Push Menu – MORE INFO / DEMO

This is a cool mobile ready mega menu plugin. It is great for featuring e.g. key products with images and text in the navigation area. It is easy to embed videos/images/forms etc. into the mega menu.

QuickAccess Menu – MORE INFO / DEMO

Easily customizable, easy to integrate and provides quick access to your site. The code is flexible for the product to be fully responsive. The minimal design was created to fit harmoniously with your site.

Sticklr – Sticky Side Panel jQuery Plugin – MORE INFO / DEMO

Inspired by Envato site-switcher, here is a useful sticky side panel made with CSS and enhanced greatly with jQuery.

Puffer Fish Navigation – MORE INFO / DEMO

Rollover navigation with a glow.

Tree – JQuery Tree Plugin – MORE INFO / DEMO

An easy to install JQuery Plugin that contains more options than most users will ever need. This plugin takes your HTML and turns it into a collapsible menu system with endless numbers of menus within menus. Works great with all major browsers e.g. Chrome, Safari, Firefox and even IE.

Sherpa | Complete Navigation System – MORE INFO / DEMO

As the name suggests, Sherpa is a total solution for all your navigation requirements. Sherpa brings together the three main navigation elements of every interface – Navbar, Sidebar and Sticky Footer.

Slide Down Menu – MORE INFO / DEMO

The idea is to make a box with a menu item that slides out, while a thumbnail pops up. We will also include a submenu box with further links for some of the menu items. The submenu will slide to the left or to the right depending on which menu item we are hovering.

Memu – A simple JQuery Menu – MORE INFO / DEMO

A small, solid jQuery plugin which is quite easy to use. It’s a menu which can be used with or without JQuery. What’s special about this script is the included plugin jstorage.js (which is some amazing work btw) to store the current item. So if you’re navigating around, the selected item will stay highlighted. This will spare you some server-side code. You can try this one by clicking on the menu item “File -> New”.

JQuery Slick Menu – MORE INFO / DEMO

JQuery Slick Menu is a nice, configurable animated menu for your website with lots of configuration options. It is fully W3C compliant and works fine on mobile devices e.g. iPhone and iPad.

Ninja UI – MORE INFO / DEMO

Ninja user interface is skilled in the techniques of JavaScript and CSS, going unnoticed until called upon to perform the arts of webjutsu.

Image Hover Move – MORE INFO / DEMO

A simple and practical navigation or featured image jQuery plugin.

jQuery One Page Navigation Plugin – MORE INFO / DEMO

With this plugin you’ll make the page scroll smoothly when the navigation is clicked. It also automatically highlights the correct navigation section depending upon which section is scrolled to.

Sticky Footer – MORE INFO / DEMO

This Sticky Footer can contain any kind of content and is ready to be used in your website. You can build your own menu and use from 1 to 12 columns to display your content. It degrades gracefully if Javascript is disabled, the jQuery effects are used for enhancements only. It comes in two variants : a fixed width to fit your layout width and a full width taking the whole viewport width.

Dropp – MORE INFO

Dropp is a jQuery plugin which replaces regular dropdown menus ( select elements ) with alternatives you can style.

jMenu – MORE INFO / DEMO

This is a jQuery plugin that enables us to create horizontal navigations with unlimited sub-menus. Besides jQuery, it also requires jQuery UI and supports all the effects of this library. The markup of the menu is pretty clean as it makes use of nested lists.

skinableTabs – MORE INFO / DEMO

This is an unobtrusive jQuery plugin allowing you to organize your content in attractively skinned tabs.

You can use skinableTabs with multiple positions, skins and transition effects. You can customize the look and feel of any skin in a dedicated CSS file.

Subway Map Visualization jQuery Plugin – MORE INFO / DEMO

This plugin renders unordered lists into a subway map similar in style to the London Underground map. It emphasizes a clean, aesthetic look with curves and proper placement of markers for stations and interchanges.

mb.verticalSlider – MORE INFO / DEMO

This plugin will let you show long list of elements managing pagination, it can work with elements already in the DOM of your page or loading them via ajax when needed. And it works with mouse wheel of course.

jCrumb – MORE INFO / DEMO

JCrumb is a JQuery plugin for instantly adding breadcrumbs to any webpage without the need to worry about sitemaps, or server side languages.

jQuery Stepy – A Wizard Plugin – MORE INFO

jQuery Stepy is a plugin based on FormToWizard that generates a customizable wizard.

Accordion Menu using jQuery – MORE INFO / DEMO

This plugin offers two options: The menu can be designed to either be toggled by clicking or by simply scrolling over the menu.

jQuery Context Menu – MORE INFO / DEMO

ContextMenuis a lightweight jQuery plugin that lets you selectively override the browser’s right-click menu with a custom one of your own.

Autobrowse Endless Scroller – MORE INFO / DEMO

When run on a DOM element, this plugin will make the element grow and fill its content automatically when the user scrolls to the bottom of the element. The content is fetched via ajax, and the plugin keeps a cache using local storage.

原文地址:http://www.goodfav.com/35-useful-jquery-menu-plugins-1257.html

35+个实用jQuery菜单插件的更多相关文章

  1. 11个实用jQuery日历插件

    1. FullCalendar FullCalendar是很出名的jQuery日历插件,它支持拖拽等功能,整合了Google Calendar,而且可以通过JSON来绑定事件,设计师可以轻松地自定义日 ...

  2. jquery菜单插件

    原理很简单. 涉及到知识点: 1.jquery的position注意这里是jquery的position,不是css的position offset的概念 2.>的概念. 3..ulh>l ...

  3. 分享21个基于jquery菜单导航的效果

    jquery导航菜单插件制作jquery动画菜单熔岩灯菜单效果更新时间:02月15日 14:53:03 虾米精选-菜单导航-导航菜单 0浏览 / ★★★☆☆星级 / 未知软件大小/ jquery导航菜 ...

  4. 《JQuery常用插件教程》系列分享专栏

    <JQuery常用插件教程>已整理成PDF文档,点击可直接下载至本地查阅https://www.webfalse.com/read/201719.html 文章 使用jquery插件实现图 ...

  5. 一款效果精致的 jQuery 多层滑出菜单插件

    想要以用户友好的方式呈现多级菜单是件不容易的事情,而且还要跨浏览器兼容就更难了.Multi-Level Push Menu 这款 jQuery 插件提供了呈现这种菜单的解决方案,能够让你无限制的展示菜 ...

  6. Smint – 用于单页网站制作的 jQuery 导航菜单插件

    Smint 是一款用于实现单页风格网站的 jQuery 导航插件,包含两部分:固定在页面顶部的精美导航条和能够在你点击的时候自动滚动到对应内容的菜单按钮.Smint 使用非常简单,只有一个参数用于设置 ...

  7. 精选29款非常实用的jQuery应用插件

    今天我们来分享一些实用的jQuery应用插件,没有特别花哨,但都比较实用,jQuery菜单.jQuery图片都有涉及到,一起来看看. 1.jQuery+CSS3仿IOS无线局域网Wifi DEMO演示 ...

  8. 分享7款非常实用的jQuery/CSS3插件演示和源码

    上次我们分享了15款效果很酷的最新jQuery/CSS3特效,非常不错,今天要分享7个非常实用的jQuery/CSS3插件演示和源码,一起来看看. 1.jQuery ajax点击地图显示商家网点分布 ...

  9. 【jQuery】smartMenu右键自定义上下文菜单插件(似web QQ)

    (前端用重点整理博客地址)链接地址:http://www.cnblogs.com/atree/archive/2011/06/30/jQuery-smartMenu-javascript.html 一 ...

随机推荐

  1. 不要完全相信Chrome控制台打印的信息

    以下两张图,第一张是Chrome控制台Network里请求返回的信息,图二是在代码里在请求返回的处理第一行代码用console.log打印的信息. 图一 图二 那么问题来了,为何通过console.l ...

  2. ubuntu安装docker,docker部署dotnetcore2.0 web应用(三)

    我是在本地安装的虚拟机 1.下载ubuntu18.0.4 iso镜像包 2.打开win10自带的Hyper-V管理器 3.创建新的虚拟机,引用ubuntu18.0.4 iso镜像包,一步步安装成功. ...

  3. OVS处理upcall流程分析

    处理upcall总体框架: 1.由函数handle_upcalls()批量处理(in batches)的是由内核传上来的dpif_upcalls,会解析出upcall的类型.这里主要看在内核中匹配流表 ...

  4. matlab 高级函数 —— circshift、squeeze

    circshift:顾名思义,循环移动,循环的意义在于,移出的数据不丢失,而是来到队列的首部位置,也即其实是将原始序列视为一种圆环. 1. 基本用法 默认为右移. Y = circshift(A,K) ...

  5. 分布式系统和CAP

    帽子理论(CAP): C:Consistency,一致性, 数据一致更新,所有数据变动都是同步的 A:Availability,可用性, 好的响应性能,完全的可用性指的是在任何故障模型下,服务都会在有 ...

  6. tomcat添加跨域访问功能-Access-Control-Allow-Origin:*

    目标:tomcat服务器提供的接口,不能在其他域中访问的时候,需要增 Access-Control-Allow-Origin:* 直接配置的方法很多,但是我一个没有成功过,所以只能自己写拦截器了. 1 ...

  7. 【struts2+hibernate4】小型电子商务站点

    这里使用的是struts2和hibernate4两个框架开发的一个小型电子商务站点,数据库方面我也会给出对应的代码. 总之使用的是:struts2+hibernate4+jsp+MySQL+tomca ...

  8. .net 程序员 两年工作总结

    2013 年7月毕业,算一算从开始在现任的公司实习到现在已经有小两年的时间了.公司的工作虽然不忙,但也一直没有时间思考一下. 现在决定辞职了,忽然一下轻松的让人想思考. 普通程序员.普通本科生.普通的 ...

  9. matlab Tricks(二十七)—— 可变输入参数输出参数的适配

    matlab 内置的对 varargin/varargout(nargin/nargout)的支持,使得 matlab 的输入参数和输出参数,有了更为灵活的传递和使用: 比如对于 matlab 原生支 ...

  10. 给WPF示例图形加上方便查看大小的格子

    原文:给WPF示例图形加上方便查看大小的格子 有时,我们为了方便查看WPF图形的样式及比例等,需要一些辅助性的格线,置于图形.图像的背景中. 比如下图,就是为了更清晰地查看折线的图形,我们画了用于标示 ...