插件库集合,你值得拥有

774 阅读4分钟

小知识,大挑战!本文正在参与“程序员必备小知识”创作活动。

大家好,我是孤独,来源于掘友的称呼。今天收集一些项目中用到的小插件。

LazyLoad

官网链接

Lazy Load延迟加载插件延迟了长网页中图像的加载。用户滚动到视窗之外的图像之前,不会加载它们。

基本用法,参考官网,我就不举栗子了。

lightSlider

官网链接

JQuery lightSlider 是一个轻量级触摸响应滑块插件(5KB缩减),附有缩图导览。另外还有相本功能、垂直跑马灯,应用层面广泛。

Pickadate.js

官网链接

Pickadate.js是一个适应移动端,响应迅速且轻巧的jQuery日期和时间输入选择器插件。

  • 支持jQuery 1.7及更高版本。
  • 启用ARIA以符合WCAG 2.0。 (added in v3.4)
  • 加载很小的JS和CSS文件。
  • 随附40多种语言的翻译。
  • 具有触摸和键盘友好性。
  • 遵循BEM样式类命名。
  • 利用基于LESS的样式表。
  • 包括基于Grunt的构建系统。 640.gif

typeahead.js

官网链接

typeahead.js 是 twitter 开发的一个快速、功能强大的自动完成插件。

640.gif

textillate.js

gitHub地址

Textillate.js 是一款实现极酷 CSS3 文本动画的简单插件。它整合了两个流行的工具库(animate.css 和 lettering.js)来提供易于使用的插件,能够把 CSS3 动画应用到文本内容上。

640.gif

Chart.js

示例文档

chart为设计和开发人员准备的简单、灵活的 JavaScript 图表工具。常见的图表都能在上面找到。

image.png

image.png

image.png

Moment.js

官网链接

轻量级专门解析、验证、操作、格式化日期的JavaScript函数库。 安装方式:

  • npm install moment --save # npm
  • yarn add moment # Yarn
  • Install-Package Moment.js # NuGet
  • spm install moment --save # spm
  • meteor add momentjs:moment # meteor

Animate.css

官方文档

纯CSS,无需JavaScript,支持多浏览器的动画特效。

具体用法和示例,见官网。

Ace

ace 是一个用 JavaScript 编写的独立代码编辑器。我们的目标是创建一个基于浏览器的编辑器,该编辑器匹配并扩展现有本机编辑器(如 TextMate,VIM 或 Eclipse)的功能,可用性和性能。它可以轻松嵌入任何网页或 JavaScript 应用程序中。Ace 是 Cloud9 IDE 的主要编辑者,也是 Mozilla Skywriter(Bespin)项目的继承者。

PDF.js

gitHub地址

PDF.js是一个由HTML构建的PDF阅读器,由Mozilla Labs所推广,目标是建立一个通用的PDF平台。

Fine Uploader

gitHub地址

导入拖拽上传档案,跨浏览器、原生JavaScript又加上免费开源,只要载入JavaScript就可以开始运行,不依赖其他程序。

Hover.css

官方文档

一组 CSS3 驱动的悬停效果,可应用于链接、按钮、徽标、SVG、特色图像等。轻松应用于您自己的元素、修改或仅用于灵感。在 CSS、Sass 和 LESS 中可用。

Muuri.js

使用文档

Muuri是一个JavaScript Layout引擎,让你可以构建多样化的Layout,并具有响应式、可排序、可过滤、拖拽移动或动画效果。

Three.js

官方文档

易于使用且轻量级3D函数库,提供canvasSVGCSS3 3DWebGL渲染器。

clipboard.js

使用文档

复制内容到剪切板的小工具,不依赖Flash,大小只要3KB。

howler.js

使用文档

howler.js是针对当下网站的一个音频播放函数库,预设为Web Audio API和HTML5 Audio,可以透过JavaScript播放声音变得更简单,并且跨平台。

p5.js

官方文档

p5.js 使用绘图的比喻并有一副完整的绘画功能。除此之外,您也不单限于您的绘图画布。您可以将您整个浏览器页面当作您的绘图,这包括了 HTML5 物件如文字、输入框、视屏、摄像头及音频。

fullPage.js

官方文档

演示文档

fullPage.js的主要功能有:支持鼠标滚动、支持前进后退和键盘控制、多个回调函数、支持手机、平板触摸事件、支持 CSS3 动画、支持窗口缩放、窗口缩放时自动调整、可设置滚动宽度、背景颜色、滚动速度、循环选项、回调、文本对齐方式等等

fullcalendar

官方文档

设计一个满版且可拖拽事件的行程日,Bootstrap的排版风格,可读入JSON格式数据,安装容易、支持响应式排版。

TinyMCE

官方文档

TinyMCE是一款易用、且功能强大的所见即所得的富文本编辑器。同类程序有:UEditor、Kindeditor、Simditor、CKEditor、wangEditor、Suneditor、froala等等

Swiper

官方文档

幻灯片/跑马灯插件,使用效能高,并可运用在移动设备上及混合式App上,不但在最新版本的IOS上运行良好,在Android、Windows Phone 8和PC设备上一样表现优秀。要注意的是,Swiper并不兼容所有平台设备,而是专注于当下主流平台设备的兼容性和效能上。同时Swiper也是Framework7和Ionic Framework的组件的一部分。

Quill

官方文档

Quill是一个跨平台的功能强大的富文本编辑器。开发者可以通过简单的API来控制编辑器的内容。对于移动设备的支持度高。

Cleave.js

使用文档

Cleave.js是一个帮助表单实现各种复杂实时格式化显示的工具库。

alertify.js

官网链接

为了美化通知信息而生的JavaScript框架。