前端常用的插件和工具类库合集

在前段工作中，通常会将常用的功能或模块进行封装，以提高代码的灵活性。这里给大家总结了一些常用的开源插件和工具类。

目录

一、动画库

1.Animate.css

2.Anime.js

二、滚动库

1.mescroll 移动端上拉刷新下拉加载

2.Scrollbox 图片文字滚动插件

3.liMarquee jQuery无缝滚动插件

三、移动端开发手势库

1.Hammer.JS

2.移动端事件库Touch.js

四、字体

1.自由字体

2.字体导航

3.字体识别神器

五、其他

---

一、动画库

1.Animate.css

CSS3 动画库，也是目前最通用的动画库。

地址：https://daneden.github.io/animate.css/

该网站展示了常见的动画样式，可以下载npm或者引入css样式，设置class名就能得到想要的样式，方便好用。

2.Anime.js

一个强大的、轻量级的用来制作动画的javascript库 

地址：anime.js • JavaScript animation engine

二、滚动库

1.mescroll 移动端上拉刷新下拉加载

地址：http://www.mescroll.com/api.html jQuery

2.Scrollbox 图片文字滚动插件

地址：http://www.jq22.com/jquery-info1890

3.liMarquee jQuery无缝滚动插件

地址：http://www.dowebok.com/188.html

效果示例：jQuery无缝滚动插件liMarquee演示-默认效果_dowebok 

三、移动端开发手势库

1.Hammer.JS

Hammer.js是一个轻量级的触屏设备的手势插件库,它能帮我们识别出在移动端开发过程中遇到的触摸,拖动,长按,滑动,手指平移,双指捏拿缩放等常见的用户手势操作。

官网：http://hammerjs.github.io/

使用教程可百度，可参考这篇文章：页面控制--移动端开发手势库Hammer.JS使用文档_hammer.js官网-CSDN博客 

2.移动端事件库Touch.js

Touch.js是移动设备上的手势识别与事件库, 由百度云Clouda团队维护，也是在百度内部广泛使用的开发工具.(已停更)

Touch.js手势库专为移动设备设计,是Web移动端touch点击事件不错的解决方案.

官网：https://www.bootcdn.cn/touchjs/

四、字体

前端拿到设计稿有时需要自己来改些内容或者图片，但字体电脑上又没有，这时需要下载所需的字体，这里提供了免费字体下载。

1.自由字体

自由理想体免费下载_自由理想体效果预览_免费字体自由理想体

2.字体导航

字体导航-免费字体/商用图片-设计师实用百宝箱-字体传奇网（ZITICQ）

3.字体识别神器

字体识别，上传图片找字体在线工具-站长字体

五、其他

参考文章：前端常用插件、工具类库汇总，不要重复造轮子啦！！！-CSDN博客