50个jQuery插件可以让你的网站更上一层楼

Web领域在过去每天(甚至几个小时)都在变化，边界也在变化，随着边界的扩大，也有了很多新的发展。在这些进步中，开发人员的持续工作创造了更大更好的脚本，这些脚本以插件的形式带来了更好的最终用户体验。它们比以前更轻，处理能力更强。

关键是这些新开发的脚本和插件可以构建一个响应性很强的Web，不会失去原有的特性。除了更好更轻(就文件大小而言)，它们不会增加页面加载的时间。

通过浏览文档很容易掌握JQuery的语法。它可以支持选择DOM元素、创建动画、处理事件和开发Ajax应用程序，甚至为开发人员提供了基于JavaScript类库创建插件的能力。

jQuery架构的开发人员可以创建一个插件代码来扩展其功能，这样它就可以产生一些最好的插件，并将您的网站或任何给定的项目提升到一个全新的水平。

在本文中，我们积累了一些最好的JQuery插件供您选择。这些插件提供了各种各样的功能和特性，可以让你的网页呈现出很多想象得到的效果。我们希望您能在下面的列表中找到您正在寻找的插件。

在下面的评论区，让我们知道你以前使用过哪些插件，或者你正在为未来的项目或网站考虑哪些插件。

1.闪烁板

闪烁板是一个易于使用的jQuery插件，可以让你弹出内容。它还依赖于Modernizr进行触摸检测，并使用jQuery。触摸事件中的手指库。闪烁板有多种配置。您可以通过调用Javascript来设置选项。或者，您可以使用实际元素上的数据属性来设置选项。

2.标记JS

Tagjs是一个jQuery插件，用于创建一个高度可定制的前端TaggingJS系统。它小于3 kb，支持世界上大多数浏览器。它基于麻省理工学院的许可。

3.卷轴魔法

ScrollMagic是一个用于神奇滚动交互的jQuery插件，ScrollMagic允许你像使用进度条一样使用滚动条。如果你想在指定的滚动位置开始一个动画，保持动画与滚动条移动同步，并将一个元素固定在指定的滚动位置(粘性元素)，这是一个适合你的插件。

32.JavaScript支持的分页

JPages是一个客户端分页脚本(jQuery插件)，它具有键盘滚动导航、自动页面更改、延迟呈现和可定制的导航面板等功能。任何数量的分页元素页面都可以插入到同一个页面中，并且很容易定位。

5.PNotify

PNotify是SciActive开发的一个JavaScript通知插件，以前被命名为Pines Notify。它的设计思想是提供一个极其灵活且易于实现和使用的。它可以提供非阻塞通知。允许用户单击通知后面的元素而不关闭它。PNotify使用Bootstrap和jQuery UI来定义样式，这意味着定制主题样式非常容易。

6.完全地

整体是一个jQuery插件，用于触发表列上的mouseenter和mouseleave事件。整体用于突出显示整个表列，并支持表的colspan和rowspan属性。如果希望支持colspan和rowspan属性，需要首先构建表的单元格索引。之后，您需要跟踪表中所有单元格的事件，找出您感兴趣的内容，并计算它们在矩阵和共享同一垂直索引的列中的偏移量。完全没有设置特定风格的限制。

7.MixitUp

MixItUp是一个jQuery插件，提供动画过滤和排序。它在管理像文件夹一样易于分类或有序的内容和博客方面非常好，但它也可以用作一个有吸引力的应用程序UI和数据可视化的强大工具。

8.Velocity.js

Velocity是一个jQuery插件，它重新实现了$。animate()并包括改进动画过程的新功能(使Velocity比CSS动画库更快)，用于生成性能卓越的动画。

9.rowGrid

RowGrid.js是一个小型、轻量级的jQuery插件(gzip后约700位)，用于将图片(或其他内容项)直线放置。谷歌图像搜索、flickr、shutterstock和谷歌图片等网格。RowGrid.js响应迅速，允许用户无限滑动。的所有内容项都具有相同的高度，但宽度是可变的。

10.Croppic

Croppic是一个用于图像裁剪的jquery插件。除了满足你的需求，它还能提供更多的功能。只需上传一张图片，然后就可以根据自己喜欢的放大缩小的实际情况对图片进行裁剪。它需要IE 10、chrome和firefox才能正常工作。它使用FormData，所以现在不支持IE9和以前的版本。

11.ImageLightbox.js

ImageLightbox.js是一个令人难以置信的简单、响应迅速和触摸友好的脚本。可扩展，可配置，极度简化(瘦身后只有4kb)，用CSS变形变换移动图片。

12.jQuery提示卡

提示卡插件允许您使用类似卡片的交互创建您在谷歌提示页面上看到的卡片布局。有几个新的动画选项，因此您可以根据自己的喜好进行自定义。当模态窗口打开或关闭时，可以使用回调方法。它已经在像Chrome、火狐和Safari这样的现代桌面浏览器中进行了测试。

13.Floatlable.js

在布拉德弗罗斯特写了一篇关于浮动标签模式的博文后，浮动标签模式获得了成功。这个想法是基于马特D史密斯的《可滴镜头》。这种模式很容易解释。当用户与输入字段交互时，占位符的值会上移并显示在文字上。

14.纳米凝胶

nanoGallery很容易实现jQuery的画册插件。它有很多特点：支持触控、响应快、支持云存储。相册多级导航，灯箱效果，多缩略图悬停效果，滑动显示，全屏，分页，图片延时加载，主题，自举兼容性，自定义，从Flickr/Picasa/Google拉照片。

15.jQuery全景查看器

jQuery全景查看器可以帮助您在网站中嵌入全景图片。有了这个插件，你可以在你的网站上显示你的全景图片。为此，首先您必须在文档中包含最新的JQuery库jquery.panorama_viewer.js和panorama_viewer.css，然后在HTML中将“panorama”类添加到图片中。Chrome、Firefox和Safari等现代浏览器的桌面版和移动版已经过测试。

16.魔术

SVGMagic是一个跨浏览器兼容的JQuery插件，它可以在你的网站上搜索SVG图片，如果浏览器不支持SVG，它会自动创建PNG版本。它是一个简单的、单一用途的插件，不需要配置。

17.BttrLazyLoading

BttrLazyLoading是一个jQuery插件，允许您的web应用程序只在窗口中加载图片。它还允许您在4种不同的屏幕尺寸下拥有不同版本的图片。BttrLazyLoading允许您的web应用程序延迟加载图片，直到它们滚动到图片。这样，页面加载时间大大减少。

18.远程的

Remodal是一个扁平的、响应迅速的、轻量级的、高速的、易于定制的、声明性的状态注释和散列跟踪模式窗口插件。所有支持的现代浏览器。您可以轻松定义模态背景容器(就像失焦效果一样)。

19.Slinky.js

Slinky.js是一个jQuery插件，用于使用堆栈头创建滑动导航列表。它有许多功能：就像通过禁用光标事件来平滑滑动一样，压缩后轻量级约1KB，在窗口大小调整和DOM更改时刷新，并与您最喜欢的浏览器的最新版本兼容。

20.适应性背景

Adaptive Backgrounds是一个jQuery插件，用于从图片中提取主色并将其应用于父元素。这个插件利用了画布元素和ImageData对象。由于其跨站点的安全限制，如果脚本试图从当前域名以外的主机提取图片的颜色，它将失败，除非图片被允许跨源资源共享。

21.大脚野人。参见SASQUATCH

网页上的脚注很烦人。你点击一个小数字，跳转到页面底部，找到你要找的脚注，然后点击一个链接返回到页面的原始位置。大脚似乎让整个过程不那么痛苦。它自动检测脚注的链接和内容，将链接转换成一个易于点击的按钮，当读者点击脚注按钮时，会弹出一个浮动窗口。

22.动态的

Dynatable是一个使用jQuery、HTML5和JSON的更有趣、更具语义性和交互性的表格插件。而且不仅仅是为了桌子。Dynatable的目的是提供一个简单且可扩展的API，可以方便地浏览和操作大型数据集。

23.jQuery标签更好

JQuery Label Better就像优雅动画的领导者一样，可以帮助你在不占用空间的情况下给表单添加标签。这个插件最独特的地方在于，您只需要添加一个占位符文本，当用户需要时，我们会显示标签。

24.突出的

StickUp是一个jQuery插件。您可以在任何使用jQuery的网页上执行它。您可以简单地在任何页面上创建您希望用户随时看到的任何元素。只要用户滑过它，它就会粘在浏览器窗口的顶部。

25.自由墙

Freewall是一个跨浏览器响应的jQuery插件，它使用了很棒的CSS3动画效果和回调事件，可以帮助你创建很多类型的网格布局：可伸缩布局、图片布局、嵌套网格、流式网格、metro风格网格以及类似的兴趣网格。免费软件是一个集成的解决方案，用于创建桌面，移动和平板电脑的动态网格布局。

26.jQuery交互式3D

JQuery Interactive 3D是一个插件，允许我们使用多图完成类似的功能。易于使用，使用简单的功能和指定一组名称的图片。此外，还有自定义选项，如光标图标、速度、触摸屏支持、自动回放等。

27.简洁的

简洁是一个jQuery小部件，用于截断多行文本。它将文本缩短到指定的大小，并在后面添加省略号。您可以使用选择器指定要截断的元素，然后设置想要查看的数字的大小参数。

28.SlideMe

SlideMe！是一个响应风格，CSS3兼容的jQuery滑块插件，它同时支持有限视图和全屏视图。它可以用于垂直和水平屏幕，使用CSS3转换并支持分页。提供控制滑动的方法(上一个、下一个等)。)，以及与之对应的回调方法等等。

29.Glide.js

Glide.js是一个用于创建滑块的轻量级(压缩4.5kb) jQuery插件。它有完全可定制的OOCSS标记和CSS3转换，可以回调JavaScript。滑块是响应的；它可以适应所有设备，并具有触摸支持。您可以通过键盘、滑动事件、弹出窗口或箭头菜单来控制元素。Glide.js还有一个支持所有事件(播放、暂停、下一步、上一步等)的通用API。).

30.PhotoJShop

PhotoJShop是一个jQuery插件，允许我们对图像应用简单的效果和滤镜。这些滤镜包括模糊、负片、浮雕、变亮、变暗、黑白、锐化等等。插件可以在画布和图像上工作，过滤器也很容易使用。

31.一页滚动

一页滚动是一个jQuery插件，它简化了创建类似网站的难度。它只需要几个设置，只需要创建HTML结构，就可以调用函数了。可选地，作为附加功能，还可以设置其速度和循环行为。并且它支持每个页面的搜索引擎优化友好的网址。

32.FerroSlider

FerroSlider是一个jQuery插件，用于创建几乎所有类型的滑块，例如整页(或内容/图像滑块)。内容可以灵活地水平或垂直放置，插件可以使浏览变得容易。为了提高性能，使用了CSS3变换，可以很好地匹配响应布局，可以应用于移动平台。

33.Scrolld.js

Scrolld.js是一个独特的jQuery开源插件。Scrolld.js使用实时更新的数据为像素级布局和导航提供了高度精确的滚动。使用Scrolld.js，您可以始终准确地滚动到指定的目标，并始终提供最佳的用户体验。

34.动画滚动

AnimateScroll是一个简单的jQuery插件，可以用来添加松散的滚动条效果。您可以自定义滚动条样式(超过30种滚动效果)和滚动速度。“填充”属性控制滚动条的结束位置。该插件不限于整个正文页面，还可以用于指定的元素。

35.梅森JS

MasonJS jQuery插件用于解决目前大多数网格系统会遇到的问题和空白。当使用砖石、同位素或任何其他网格插件时，网格中总是会有间隙或不平坦的边缘。梅森是用来填充它们的。

36.金弗茨克罗尔

JInvertScroll是一个jQuery插件，它控制默认的滚动行为并强制垂直滚动。该插件足够轻(小于1kb)，几乎无需设置即可使用。为包装元素添加指定的类，并调用JS函数。此外，它可以通过onScroll回调轻松创建检查效果(在这里我们可以决定调整任何元素)。

37.Flowtype.js

FlowType。JS是一个jQuery插件，可以自动调整字体大小和行高(根据包装元素的宽度)，这样我们的内容就可以按照我们想要的方式显示。该插件提供了设置最小/最大字体大小和宽度的属性。

38.n进度

NProgress.js是一个纳米进度条。用逼真细腻的动画告诉用户发生了什么。这是一个轻量级的进度条，灵感来自谷歌、YouTube和Medium，非常适合Turbolinks、Pjax和其他Ajax级别的应用程序。

39.整理时间

想用友好的语言展示基于时间的更新吗？TidyTime.js就是做这个的插件，它把标准时间格式转换成个人声明的时间格式。

40.Fullpage.js

FullPage.js是一个易于使用的插件，用于创建全屏滑动网页(也称为单页网站)。它允许你创建一个全屏滑动网站，同时，在网站的每个部分添加一些水平打印样式的转盘。它是为不同的屏幕尺寸、平板电脑和移动设备设计的。

41.jQuery平面阴影

JQuery Flat Shadow是一个插件，可以给你想要的任何东西添加淡入淡出的阴影。它可以定义阴影颜色、角度和启用/禁用阴影淡化。

42.猫头鹰转盘

Owl Carousel是一个jQuery插件，允许您快速创建响应性旋转滑块。插件是触摸友好的和任意的HTML内容的特征，具有任意的表示。它有设置分页/滑动速度、启用/禁用自动播放、显示插入导航等选项。

43.s画廊

Gallery是另一个jQuery相册插件，它在响应网格中显示图片。它的灵感来源于索尼的产品页面相册(用Flash制作)，完全模仿。当一个图片项目被点击并获得焦点时，您可以使用向前向后按钮或通过键盘浏览其他图片项目。

44.轻松流行

PopEasy是一个轻量级的jQuery插件，对于开发人员来说，简单地创建模态窗口是必要的。将蒙版应用到页面上，并打开一个可自定义的弹出模态窗口来关注重要元素。

45.向上滚动

ScrollUp是一个轻量级的jQuery插件，用于创建自定义的“滑动到顶部”功能，可以在任何网站上轻松使用。通过为活动覆盖设置指定有效的CSS颜色，创建一个可见的视线来帮助确定从顶部的理想滑动距离。

46.移动滚动

Mobiscroll是一个jQuery插件，用于在触摸屏设备(安卓手机、iPhone、iPad、Galaxy Tab)或日期和时间选择器上滚动滚动条。该控制器可以很容易地定制，以支持任何自定义值，甚至可以直接用作本地选择控制器(下拉列表)的替代。控制器可以有主题。你可以很容易地在CSS中改变外观。它还支持预定义的美丽的颜色模式。在iOS4、安卓2.2、安卓2.3、Chrome、Safari、火狐、IE9上测试过。

47.周期2

Cycle是过去流行的jQuery幻灯片放映插件，现在有了增强版：Cycle2。这个插件非常适合那些希望创建完全个性化的幻灯片放映效果的人，因为它没有声明任何标记或样式。而且，它的功能非常灵活。Cycle2支持响应性布局，包括几乎所有选项(全局或单个幻灯片)，并且可以通过使用具有所有功能的API轻松扩展。

48.工具提示器

Toolster是一个jQuery插件，用于快速创建HTML5验证和灵活的工具提示。该插件属于“麻雀虽小五脏俱全”的类型，压缩后只有4.8kb，但工作速度非常快，可以轻松定制。它的外观可以用CSS(主题支持)和箭头来修改，可以定义改变鼠标位置和延迟等特殊效果。

49.FitText

FitText是一个非常简单但功能强大的jQuery插件，可以用来确保文本能够适应定义的元素。它会根据周围元素的宽度自动更新字体大小，确保布局不会太零碎(因为字体大小的原因)，即使页面是在桌面浏览器或移动终端中显示。此外，该插件提供了一些微调选项，包括设置“水平缩放”和最小到最大大小的能力。

50.未滑动

Unslider只是一个用于图片显示的jQuery滑块插件。没有华丽的特效和多余的装饰，插件不到3kb。它流畅、灵活、小巧得令人难以置信。Unslider目前已经在所有浏览器的最新版本中进行了测试，但它并没有那么新，只能看到它的“孤独荣耀”。如果需要，可以增加键盘方向键支持。不是所有的滑块插件都是一样的，Unslider很清楚这一点。(译者：作者卖的是孟吗？)