推荐超实用的8款jQuery插件

Love The Way You Lie 2022-08-26 14:20 239阅读 0赞

[![53967cba-ed25-42e1-aef0-538fd0d7bf8a.jpg][]][53967cba-ed25-42e1-aef0-538fd0d7bf8a.jpg 1]

这里有8款超实用的[jQuery插件][jQuery]供大家参考使用，除了jQuery特效的详细使用方法以外，我们还有在线演示和下载及教程，希望对大家有所帮助！

## [超棒的视差效果jQuery插件 - FractionSlider ][jQuery_ - FractionSlider]    ##

[![51b71a2a-ec26-4d3b-bfc7-0ef84ca1f33d.jpg][]][jQuery_ - FractionSlider]

## [在线演示][Link 1]    ##

如果你希望找到一款与众不同的[jQuery][jQuery 1]幻灯插件的话，F[ractionslider/][ractionslider] 肯定会让你眼前一亮，和传统幻灯不同的是，它可以让页面中的任何元素生成独立的动画效果。

## [推荐一款支持响应式的jQuery幻灯插件Glide.js ][jQuery_Glide.js]    ##

[![ff703c31-a1d0-4d33-a7c7-bd963fa522dc.jpg][]][jQuery_Glide.js]

[在线演示][Link 2]

响应式设计绝对是最近两年的大火设计方式，针对不同的设备都能很好的显示内容，绝对对于我们这些前端攻城师来说是个天大的好消息，咱再也不用费劲的 在不同浏览器和设备上做兼容性的痛苦调试了，最近项目中使用了一个支持响应式的幻灯插件Glide.js，今天有空和诸位一起分享一下！

Glide.js使用非常简单，主要特性也非常足，完美的满足了我们开发中大部分的需求，缺省使用CSS3的动画来展示特效，如果遇到不支持的老式浏览器，它会非常智能的转到传统的js方式来展示效果。

# [jQuery开发的大图片预览效果插件 - AbigImage ][jQuery_ - AbigImage]    #

[![bc9cd087-6b1c-42a2-9569-2950941b5c12.jpg][]][jQuery_ - AbigImage]

## [在线演示][Link 3]    ##

此款插件主要特点包括：

*  使用href来定义大图片
 *  点击图片打开下一张，点击左侧箭头打开前一张，点击右侧按钮关闭
 *  支持热键控制上一张，下一张和关闭
 *  浏览所有图片后关闭
 *  预加载前一张和后一张
 *  样式可以自定义
 *  顶部和底部区域自定义
 *  自定义onopen方法

## [jQuery Plugin-菜单特效 ][jQuery_Plugin-_]    ##

[![b6ed7768-72a4-42e1-aadd-31047e7ab6c4.jpg][]][jQuery_Plugin-_]

## [在线演示][Link 4]    ##

这是一个基于jquery的插件，类似滑动菜单，体积也很小，适合在手机上使用。

## [jquery插件-导航特效 ][jquery_-_]    ##

[![ec71003d-c33c-4dd8-89b3-04f7a2ef8849.jpg][]][jquery_-_]

## [在线演示][Link 5]    ##

一款跨浏览器、多级推送菜单、可以无限嵌套导航元素的[jQuery插件][jQuery]，这个[jQuery插件][jQuery]是受Codrops的多层次推送菜单启发而成的，但是，不同的是，它不依赖于css3D转换，因此在旧的浏览器（i.e. IE8）上面功能也不相同。

# [Naver——简单的的把nav标签变成导航栏 ][Naver_nav_]    #

[![513b4a71-5539-4a0e-a115-3d9504fe45f1.jpg][]][Naver_nav_]

## [在线演示][Link 6]    ##

Naver是一款jquery插件，能够迅速响应，友好切换，支持ie！

## [另类jquery导航插件——listnav ][jquery_listnav]    ##

[![ce6dfb4f-9ff3-456e-96f6-61f3d55f81a6.jpg][]][jquery_listnav]

## [在线演示][Link 7]    ##

快速查找导航插件，可以做书签或者其他便于查看的页面中，非常好用！

## [使用javascript开发的视差滚动效果的云彩 ][javascript_]    ##

[![f6c0544d-bf3d-458b-b637-2263726463f4.jpg][]][javascript_]

## [在线演示][Link 8]    ##

jquery.parallax.js是一款能够帮助你快速开发视差效果的[jQuery插件][jQuery]，在这里我们使用它来开发一款漂亮的云朵视差效果。

> 本周推荐已完成，如果你也喜欢我们推荐的内容，请关注我们的极客标签!

相关阅读：

*  [8款HTML5实现的超酷特效和应用][8_HTML5]  
    
 *  [推荐9款使用CSS3实现的超酷动画效果][9_CSS3]  
    
 *  [分享六个基于Bootstrap的实用开发教程和模板演示][Bootstrap]  
    
 *  [推荐7款超棒的单页面网站设计模板。关键是！免费！！][7]  
    
 *  [9款HTML5实现的超酷特效 ][9_HTML5_]

原文来自：[推荐超实用的8款jQuery插件 ][8_jQuery_]

[53967cba-ed25-42e1-aef0-538fd0d7bf8a.jpg]: http://www.gbtags.com/gb/networks/uploadimgthumb/53967cba-ed25-42e1-aef0-538fd0d7bf8a.jpg
[53967cba-ed25-42e1-aef0-538fd0d7bf8a.jpg 1]: http://www.gbtags.com/gb/networks/uploadimg/53967cba-ed25-42e1-aef0-538fd0d7bf8a.jpg
[jQuery]: http://www.gbtags.com/gb/tag/1006.htm
[jQuery_ - FractionSlider]: http://www.gbtags.com/gb/share/2541.htm
[51b71a2a-ec26-4d3b-bfc7-0ef84ca1f33d.jpg]: http://www.gbtags.com/gb/networks/uploadimgthumb/51b71a2a-ec26-4d3b-bfc7-0ef84ca1f33d.jpg
[Link 1]: http://www.gbtags.com/gb/demoviewer/2541/f982a2ce-5267-4583-82f4-1f487f62ef34/example%7Cindex.html.htm
[jQuery 1]: http://www.gbtags.com/gb/tag/1003.htm
[ractionslider]: http://jacksbox.de/stuff/jquery-fractionslider/
[jQuery_Glide.js]: http://www.gbtags.com/gb/share/2421.htm
[ff703c31-a1d0-4d33-a7c7-bd963fa522dc.jpg]: http://www.gbtags.com/gb/networks/uploadimgthumb/ff703c31-a1d0-4d33-a7c7-bd963fa522dc.jpg
[Link 2]: http://www.gbtags.com/gb/demoviewer/2421/29113965-164f-450e-a8e8-5e430b5eb965/index.html.htm
[jQuery_ - AbigImage]: http://www.gbtags.com/gb/share/2816.htm
[bc9cd087-6b1c-42a2-9569-2950941b5c12.jpg]: http://www.gbtags.com/gb/networks/uploadimgthumb/bc9cd087-6b1c-42a2-9569-2950941b5c12.jpg
[Link 3]: http://www.gbtags.com/gb/demoviewer/2816/1a87a0e8-dcb7-458c-a1a5-77299fad8ddd/index.html.htm
[jQuery_Plugin-_]: http://www.gbtags.com/gb/share/2868.htm
[b6ed7768-72a4-42e1-aadd-31047e7ab6c4.jpg]: http://www.gbtags.com/gb/networks/uploadimgthumb/b6ed7768-72a4-42e1-aadd-31047e7ab6c4.jpg
[Link 4]: http://www.gbtags.com/gb/demoviewer/2868/b1290e30-864a-440e-ac2f-c18be7ec92f9/jQuery.mmenu-master%7Cdemo%7Ccolors.html.htm
[jquery_-_]: http://www.gbtags.com/gb/share/2869.htm
[ec71003d-c33c-4dd8-89b3-04f7a2ef8849.jpg]: http://www.gbtags.com/gb/networks/uploadimgthumb/ec71003d-c33c-4dd8-89b3-04f7a2ef8849.jpg
[Link 5]: http://www.gbtags.com/gb/demoviewer/2869/7f585995-18d3-4465-a80b-614b63302560/MultiLevelPushMenu_v2.1.4%7Cdemo%7Caddremove%7Caddremove.html.htm
[Naver_nav_]: http://www.gbtags.com/gb/share/2905.htm
[513b4a71-5539-4a0e-a115-3d9504fe45f1.jpg]: http://www.gbtags.com/gb/networks/uploadimgthumb/513b4a71-5539-4a0e-a115-3d9504fe45f1.jpg
[Link 6]: http://www.gbtags.com/gb/demoviewer/2905/40afa7b1-2916-455a-a650-834151ab27db/Naver-master%7Cindex.html.htm
[jquery_listnav]: http://www.gbtags.com/gb/share/2938.htm
[ce6dfb4f-9ff3-456e-96f6-61f3d55f81a6.jpg]: http://www.gbtags.com/gb/networks/uploadimgthumb/ce6dfb4f-9ff3-456e-96f6-61f3d55f81a6.jpg
[Link 7]: http://www.gbtags.com/gb/demoviewer/2938/c1c02922-dd22-42c6-bee3-f2e700f5adae/listnav%7Cindex.html.htm
[javascript_]: http://www.gbtags.com/gb/share/2976.htm
[f6c0544d-bf3d-458b-b637-2263726463f4.jpg]: http://www.gbtags.com/gb/networks/uploadimgthumb/f6c0544d-bf3d-458b-b637-2263726463f4.jpg
[Link 8]: http://www.gbtags.com/gb/demoviewer/2976/98157460-f013-4af1-bd5b-352ba14c80f2/index.html.htm
[8_HTML5]: http://www.gbtags.com/gb/share/3023.htm
[9_CSS3]: http://www.gbtags.com/gb/share/2955.htm
[Bootstrap]: http://www.gbtags.com/gb/share/3034.htm
[7]: http://www.gbtags.com/gb/share/3067.htm
[9_HTML5_]: http://www.gbtags.com/gb/share/3122.htm
[8_jQuery_]: http://www.gbtags.com/gb/share/3152.htm