我想大家都用过一些APP应用，它们的菜单展示是以侧边栏滑动方式展现，感觉很新鲜，而现在网页设计也是如此，不少网站也效仿这样的方式来设计。使用侧边栏的好处就是可以节约空间，对于一些内容多或者喜欢简约的网站来说可以尝试使用侧边工具栏的方式来展示。

OpenPanel

以全屏的方式展示面板，Metro风格，看起来不错。


进入下载页 | 查看演示

Mb.Jquery

这个mb jQuery插件支持上下左右的方式来展示侧边栏。


进入下载页 | 查看演示

PageSlide插件

这个边栏面板插件可以左右展出，我在用Chrome查看效果的时候还是很流畅的。


查看演示及下载

Sidr

这个插件之前的文章也分享过，支持响应式设计。


查看演示及下载

Mmenu

看起来是不是有点像手机的APP程式侧边菜单？插件使用只需要一段JavaScript代码就行了，方便好用啊。


查看演示及下载

Multi-Level Push Menu

目前Demo我在新版Chrome测试不出效果，在Firefox就可以了。但是这个侧边栏jQuery菜单插件挺强大的，支持多级菜单滑动。


查看演示及下载

简单的YouTube菜单效果

这个菜单效果模仿youtube网站，点击菜单图标时，图标和菜单的主标题有动画显示。


查看演示及下载

Slide And Push Menus

这个滑动面板不错，有推拉式滑动以及像Fixed定位方式展示出来，左右上下都有，很实用。


查看演示及下载

Google Nexus网站菜单

这个侧边栏菜单模仿Google风格，效果很好。


查看演示及下载

JPanelMenu

这个侧边菜单插件如果用在手机和平板设备是很适合。


查看演示及下载

GilidPanel

这个侧边工具菜单功能很强大，尤其是自定义方面，不过这是要收费的。


查看演示及下载

Pull Out Content Panel


查看演示及下载

Collapsible Sliding Panel For WordPress


查看演示及下载

Responsive Side Toggle Menu

响应式设计的侧边工具菜单。


查看演示及下载

JQuery SideBar Plugin


查看演示及下载

Animate To Hide And Slide Content With JQuery [Tutorial]

这个侧边工具栏插件支持【点击】和【hover】效果，并附带制作教程，前端人员的可以学习下。


查看演示及下载

JQuery Mobile Slide Menu

这个侧边工具栏插件的界面比较漂亮，如果不想改CSS样式的用户就直接用这个吧。


查看演示及下载

Snap.Js

一看就是Facebook风格的侧边栏


查看演示及下载

Slide Out Menu

这个slider menu和其它插件差不多，看你喜欢的咯~~


查看演示及下载

好用的侧边栏菜单/面板jQuery插件的更多相关文章

  1. 9个最新的手机/移动设备jQuery插件

    随着互联网的流行,移动网站开始急速增加,在2014年手机网站将会出现很多,所以手机网站是必须要学会制作的.手机网站不像桌面平台一样制作,否则会影响显示效果,目前大部分手机网站使用响应式设计技术,而且也 ...

  2. 最新的手机/移动设备jQuery插件

    随着互联网的流行,移动网站开始急速增加,在2014年手机网站将会出现很多,所以手机网站是必须要学会制作的.手机网站不像桌面平台一样制作,否则会影响显示效果,目前大部分手机网站使用响应式设计技术,而且也 ...

  3. 常用在网站上的30个jQuery插件

    jQuery插件是网页设计师最喜欢的.从图像滑块,图像画廊和导航插件,它们是如此众多,如此多样,如此惊人的和互动可以制作美化网站.在本文的在30个插件中,我认为必须在网站建设时用到.当然你现在可能不善 ...

  4. 2014优秀的好用的20款免费jQuery插件推荐

    2013 年最好的 20 款免费 jQuery 插件,世界买家网 www.buyerinfo.biz在这里分享给大家 这些插件对设计者和开发者都有很大的帮助,希望大家能够喜欢:) 现 今互联网市场上提 ...

  5. 2013年优秀jQuery插件

    今天为大家推荐的是2013年的第一期,在这期里面十个jQuery插件涵盖了响应式的网格布局插件.图片放大插件.表单元素中自定义select插件,google 地图插件.文件拖放上传插件.tooltip ...

  6. 2014年50个程序员最适用的免费JQuery插件

    有用的jQuery库是设计师和开发者之间一个非常熟悉的短语.这是现在互联网中最流行的JavaScript函数库之一.每个设计师和开发人员都应该知道它的重要性,而且熟悉它的功能和特点. jQuery几乎 ...

  7. 程序员们必备的10款免费jquery插件

    本周带来10款免费的jquery插件.如果你也有好的作品,欢迎分享到社区中来,在得到帮助的同时,也能与更多人分享来自你的作品. jQuery导航菜单置顶插件 - stickyUp . 在线演示 sti ...

  8. 应用于网站导航中的 12 个 jQuery 插件

    当考虑到网页设计时,导航被认为是使网页以用户友好方式展现的一个重要部分.在现代的交互网站中,导航起着至关重要的作用,如果没有正确地处理会影响你网站的访问.适当的导航工具能够帮助用户在网站的不同页面内容 ...

  9. 2013 年最好的 20 款免费 jQuery 插件

    2013 年最好的 20 款免费 jQuery 插件 oschina 发布于: 2014年01月11日 (8评) 分享到  新浪微博腾讯微博 收藏+99 互联网上面有很多 jQuery 插件,这里我们 ...

随机推荐

  1. VMware 虚拟机的网络连接方式详解

         VMWare提供了三种工作模式,它们是bridged(桥接模式).NAT(网络地址转换模式)和host-only(主机模式).要想在网络管理和维护中合理应用它们,你就应该先了解一下这三种工作 ...

  2. C#抓取网页内容

    学习材料一 <C#抓取网页数据分析> 抓取Web网页数据分析 HttpWebRequest 和 HttpWebResponse 的应用

  3. OC——动态添加Button和监听UIAlertView按钮

    1:动态添加uibutton - (IBAction)addButton:(id)sender { CGRect frame = CGRectMake(90, 200, 200, 60); UIBut ...

  4. asp生命周期

    笔记:如果不对,欢迎指出来. 当一个用户访问一个页面,实际是发送http请求到服务器,而http请求其实是socket发送特定规范(协议)的文字(报文). 然后服务器的http.sys内核模块接受 请 ...

  5. javascript EcmaScript5 新增对象之Object.freeze

    我们都知道在js里对象是很容易改变的 var obj1 ={ a:'111' } obj1.a = '222'; console.log( obj.a ) //output 222 对象的属性发生了变 ...

  6. visual studio无法输入密匙解决方法

    控制面板->程序和功能->修复/卸载(更改),当到输入密匙界面运行程序,即可出现密匙输入框. 所用程序网上搜索:CrackVS2008ForWindows7

  7. Repeater实现数据绑定

    Repeater基础 在aspx文件中加入Repeater 控件,在<ItemTemplate></ItemTemplate>包含的范围里加入自己控制的代码,需要替换的变量使用 ...

  8. 关于js中window.location.href,location.href,parent.location.href,top.location.href的用法与区别(跳出iframe方法)

    "window.location.href"."location.href"是本页面跳转 "parent.location.href"是上一 ...

  9. Building Android Apps 30条建议

    Building Android Apps — 30 things that experience made me learn the hard way There are two kinds of ...

  10. 常用的PHP正则表达式汇总

    PHP中的常用正则表达式集锦: 匹配中文字符的正则表达式: [\u4e00-\u9fa5] 评注:匹配中文还真是个头疼的事,有了这个表达式就好办了 匹配双字节字符(包括汉字在内):[^\x00-\xf ...