资讯专栏INFORMATION COLUMN

前端常用插件、工具类库汇总(上)

txgcwm / 1861人阅读

摘要:函数库动画库动画库,也是目前最通用的动画库。下拉框级联选择器移动端最好用的的筛选器组件联动筛选移动端最好用的的筛选器组件联动筛选颜色选择器时间选择器时间日期处理是一个解析,验证,操作和显示日期和时间的类库。

前言

在开发中,我们经常会将一些常用的代码块、功能块进行封装,为的是更好的复用。那么,被抽离出来独立完成功能,通过API或配置项和其他部分交互,便形成了插件。

下面这些是我在工作中积累的一些常用的前端开源插件,这里只是罗列出来,详细的用法各个插件官网或者Gayhub都有介绍。注意:往往一个解决方案会有多个插件,需要读者根据自己的实际业务需求进行甄别选用,欢迎留言交流和补充。

函数库

Lodash https://github.com/lodash/lodash Underscore
https://underscorejs.org/ Ramda https://github.com/ramda/ramda outils
https://github.com/proYang/ou...

动画库

Animate.css:CSS3 动画库,也是目前最通用的动画库。
https://daneden.github.io/ani...
Anime.js:一个强大的、轻量级的用来制作动画的javascript库 http://animejs.com/
Hover.css:CSS hover 悬停效果,可以应用于链接、按钮、图片等等。
https://github.com/IanLunn/Hover wow.js:滚动展示动画,WOW.js 依赖
animate.css,所以它支持 animate.css 多达 60 多种的动画效果。
https://github.com/matthieua/WOW Magic.css:css3 animation动画库
https://github.com/miniMAC/magic Waves:点击波纹效果
https://github.com/fians/Waves
move.js:一个小型的JavaScript库,通过JS来控制一系列的CSS动画顺序执行,使CSS3动画变得非常简单和优雅。
https://github.com/visionmedi...

滚动库

iscroll - 平滑滚动插件 https://github.com/cubiq/iscroll BetterScroll:iscroll
的优化版,使移动端滑动体验更加流畅 https://github.com/ustbhuangy...
mescroll:移动端上拉刷新下拉加载 http://www.mescroll.com/api.html jQuery
Scrollbox:图片文字滚动插件 http://www.jq22.com/jquery-in...
liMarquee:jQuery无缝滚动插件 http://www.dowebok.com/188.html

轮播图

Swiper:常用于移动端网站的内容触摸滑动 https://www.swiper.com.cn/ iSlider:移动端滑动组件
http://eux.baidu.com/iSlider/...
slip.js:移动端跟随手指滑动组件,零依赖。 https://github.com/binnng/sli...
OwlCarousel2: http://owlcarousel2.github.io... slick:
http://www.jq22.com/jquery-in... WebSlides:
https://github.com/webslides/... jQuery轮播插件slider:
http://www.jq22.com/jquery-in...

滚屏

fullpage: http://www.jq22.com/jquery-in...

弹出框

layer:独立维护的三大组件之一(layDate、layer、layim) http://layer.layui.com/
Bootbox.js: http://bootboxjs.com/ dialogBox:基于 jQuery
http://www.jq22.com/jquery-in... easyDialog:
http://www.h-ui.net/easydialo...

消息通知

Notyf:简单的响应式纯js消息通知插件
http://www.htmleaf.com/jQuery...
PNotify:页面右上角的提示信息(非弹框提示) https://github.com/sciactive/...
https://sciactive.com/pnotify/ overhang.js:是一个JQuery插件显示即时通知加粗文字、
确认或给定元素中的提示。 http://www.jq22.com/jquery-in...

下拉框

select2 https://select2.org/

级联选择器

ustbhuangyi/picker:移动端最好用的的筛选器组件、联动筛选
https://github.com/ustbhuangy...
jQueryDistpicker:移动端最好用的的筛选器组件、联动筛选
http://fengyuanchen.github.io...
http://www.jq22.com/demo/jQue...

颜色选择器

Bootstrap Colorpicker 2
https://github.com/farbelous/...

时间选择器

layDate: https://www.layui.com/laydate/

时间日期处理

Moment.js:是一个解析,验证,操作和显示日期和时间的 JavaScript 类库。 http://momentjs.com/
https://github.com/moment/moment timeago.js:轻量级的时间转换 Javascript 库
https://github.com/hustcc/tim...

表单验证

validator.js: https://github.com/chriso/val... jQuery
Validation:jQuery 表单校验
https://github.com/jquery-val...
Validform:一行代码搞定整站的表单验证!- Jquery表单验证插件 http://validform.rjboy.cn/

分页插件

pagination: https://github.com/superRayti...

以上有你需要的内容吗?
如果有,不要错过下期内容噢~~

本文内容未完待续...
作者:白小明
来源:
https://juejin.im/post/5ba7d5...

订阅号ID:Miaovclass

关注妙味订阅号:“妙味前端”,为您带来优质前端技术干货;

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/99213.html

相关文章

  • 前端常用插件工具类库汇总(下)

    摘要:上一篇前端常用插件工具类库汇总上内容摘要动画库滚动库轮播图滚屏弹出框消息通知下拉框级联选择器颜色选择器时间日期处理表单验证分页插件本篇延续上一篇的内容继续给大家带来一系列关于前端插件工具类的内容。 showImg(https://segmentfault.com/img/bVbjsMh?w=900&h=383); 前言 对本文感兴趣可以先加个收藏,也可以转发分享给身边的小伙伴,以后遇到...

    ideaa 评论0 收藏0
  • 前端常用插件工具类库汇总

    摘要:页面调试腾讯开发维护的代码调试发布,错误监控上报,用户问题定位。同样是由腾讯开发维护的代码调试工具,是针对移动端的调试工具。前端业务代码工具库。动画库动画库,也是目前通用的动画库。 本人微信公众号:前端修炼之路,欢迎关注 本篇文章整理自己使用过的和看到过的一些插件和工具,方便日后自己查找和使用。 另外,感谢白小明,文中很多的工具来源于此。 弹出框 layer:http://layer....

    GitCafe 评论0 收藏0
  • GitHub 值得收藏的前端项目[每月更新...]

    摘要:也是一款优秀的响应式框架站点所使用的一套框架为微信服务量身设计的一套框架一组很小的,响应式的组件,你可以在网页的项目上到处使用一个可定制的文件,使浏览器呈现的所有元素,更一致和符合现代标准。 GitHub 值得收藏的前端项目 整理与收集的一些比较优秀github项目,方便自己阅读,顺便分享出来,大家一起学习,本篇文章会持续更新,版权归原作者所有。欢迎github star与fork 预...

    maxmin 评论0 收藏0
  • GitHub 值得收藏的前端项目[每月更新...]

    摘要:也是一款优秀的响应式框架站点所使用的一套框架为微信服务量身设计的一套框架一组很小的,响应式的组件,你可以在网页的项目上到处使用一个可定制的文件,使浏览器呈现的所有元素,更一致和符合现代标准。 GitHub 值得收藏的前端项目 整理与收集的一些比较优秀github项目,方便自己阅读,顺便分享出来,大家一起学习,本篇文章会持续更新,版权归原作者所有。欢迎github star与fork 预...

    cocopeak 评论0 收藏0
  • 第一篇开发总结

    摘要:文件对比插件俄罗斯方块,无聊的时候可以放松一下内置浏览器,编写代码时,可一键预览,轻量文件对比软件这个你懂的反编译工具性能调试工具虚拟工具开发者社区墙电子书 前言 常言道,磨刀不误砍柴工,好的工具能让你事半功倍,所以多花点时间看一些工具,可以很好的提高编程效率,以下是我是觉得对我编程有很大帮助的工具: Visual Studio ReSharper VS写代码绝佳助手,耗内存...

    Crazy_Coder 评论0 收藏0

发表评论

0条评论

txgcwm

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<