十一、有用的JavaScript工具
最后更新于:2022-04-01 06:28:03
### 44. [epicGrid](https://github.com/Paul-Browne/epicGrid)
创建栅格系统的轻量级、响应式纯JavaScript库。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ed0b8f6.jpg)
### 45. [gridstack.js](http://troolee.github.io/gridstack.js/)
jQuery布局插件
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ed1fcf8.png)
### 46. [Roll](https://github.com/williamngan/roll)
帮助你跟踪位置、滚动、和分页的JS库
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ed2de30.png)
### 47. [Rune.js](http://runemadsen.github.io/rune.js/)
使用SVG实现的编程图像绘制系统JS库
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ed3ec24.png)
### 48. [clipboard.js](http://zenorocha.github.io/clipboard.js/)
拷贝文字到剪切板的现代化方法
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ed5082c.jpg)
### 49. [Challenger.js](http://rileyjshaw.com/challenger/)
在任何页面弹出交互式编程挑战的插入式JS库。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ed5e4f9.png)
### 50. [html5tooltips.js](http://ytiurin.github.io/html5tooltipsjs/)
带有CSS3动画的轻量级简洁Tooltip插件
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ed6c404.png)
### 51. [egg.js](https://github.com/mikeflynn/egg.js)
向网页上添加复活节彩蛋的简单JavaScript库
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ed7b4f9.jpg)
### 52. [Annotator.js](https://github.com/dvnc/annotator)
为页面中选中的文本添加注释、高亮、标签等的JS库
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ed8b63d.png)
### 53. [Svidget.js](http://www.svidget.com/)
创建梦幻般小部件的JavaScript框架
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ed9c1eb.jpg)
### 54. [Vorlon.js](http://vorlonjs.com/)
开源、可扩展、与平台无关、用于远程调试和测试JS的库
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107edb1fc5.png)
### 55. [Space.js](http://www.slashie.org/space.js/)
HTML驱动的3D滚动JavaScript库
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107edc0b74.png)
### 56. [JavaScript Garden](http://bonsaiden.github.io/JavaScript-Garden/)
JavaScript中关于 quirkier 部分的文档集合。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107edd1d30.jpg)
十、动画插件&库
最后更新于:2022-04-01 06:28:01
### 35. [iconate.js](http://bitshadow.github.io/iconate/)
体积小、性能高的跨浏览器图表转换库。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ec544a9.jpg)
### 36. [Animate-Plus](https://github.com/bendc/animateplus)
帮你设置CSS及SVG动画属性的高性能JavaScript库。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ec60951.jpg)
### 37. [Dynamics.js](http://dynamicsjs.com/)
用于创建基于物理学的CSS动画的JavaScript库
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ec715b4.png)
### 38. [mo · js](http://mojs.io/)
The ‘Motion Graphics Toolbelt’ for the web.
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ec7d7b5.jpg)
### 39. [cta.js](http://kushagragour.in/lab/ctajs/)
轻量级“行动到效果”动画库
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ec8d2aa.png)
### 40. [jQuery.smoothState.js](http://smoothstate.com/)
不显眼的页面过渡jQuery插件
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ec9a09b.jpg)
### 41. [ramjet.js](http://www.rich-harris.co.uk/ramjet/)
实现DOM元素从一个状态到另一个状态平稳过渡的库
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ecaad17.jpg)
### 42. [Animsition](http://git.blivesta.com/animsition/)
用于CSS页面过渡的简单jQuery插件
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ecb8a69.jpg)
### 43. [vivus.js](http://maxwellito.github.io/vivus/)
允许你为SVG添加动画的jQuery库。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ecc7b4b.jpg)
九、辅助工具
最后更新于:2022-04-01 06:27:58
### 32. [tota11y](http://khan.github.io/tota11y/)
一个可视化工具箱。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ec18b10.jpg)
### 33. [ally.js](http://allyjs.io/)
使访问更简单的JavaScript库。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107eb3c0b4.png)
### 34. [emojify.js](http://hassankhan.me/emojify.js/)
把Emoji关键词转换为表情图的JavaScript模块。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ec29414.png)
八、表单插件
最后更新于:2022-04-01 06:27:56
### 25. [Awesomplete](http://leaverou.github.io/awesomplete/)
超轻量级、高度可定制化的自动补全jQuery插件。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107eb87da4.jpg)
### 26. [Submitter](http://fengyuanchen.github.io/submitter/)
简单的jQuery表单提交插件。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107eb9af0f.png)
### 27. [Select or Die](http://vst.mn/selectordie/)
为元素设置样式的jQuery插件。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107eba9596.jpg)
### 28. [jQuery Nice Select](http://hernansartorio.com/jquery-nice-select/)
把原生样式替换为可定制的下拉菜单的轻量级jQuery插件。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ebbcbed.png)
### 29. [datedropper](http://felicegattuso.com/projects/datedropper/)
提供管理日期输入字段的jQuery插件。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ebc9300.jpg)
### 30. [Instantsearch.js](https://community.algolia.com/instantsearch.js/)
用于高性能即时搜索的插件。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ebdb95c.jpg)
### 31. [notie.js](https://jaredreich.com/projects/notie.js/)
清洁、简单的通知插件。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ebe9fe4.jpg)
七、延迟加载
最后更新于:2022-04-01 06:27:54
### 23. [Layzr.js](http://callmecavs.github.io/layzr.js/)
体积小、速度快、现代化、无依赖的延迟加载库。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107eb3c0b4.png)
### 24. [AntiModerate](https://github.com/whackashoe/antimoderate)
渐进图片加载库。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107eb50ef6.jpg)
六、图片编辑
最后更新于:2022-04-01 06:27:51
### 20. [PixelFlow](http://devnimlos.com/professional/pixelflow)
使用jQuery画布实现的图片模糊过滤器。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107eaf3912.png)
### 21. [Smartcrop.js](https://github.com/jwagner/smartcrop.js)
内容感知的图像裁剪库。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107eb0da16.jpg)
### 22. [Image Blur Plugin](http://msurguy.github.io/background-blur/)
超级轻量级的跨浏览器jQuery图像模糊库。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107eb1c641.png)
五、响应式图片解决方案
最后更新于:2022-04-01 06:27:49
### 18. [Rimg](http://joeyvandijk.github.io/rimg/)
纯JS的响应式图片解决方案,适用于支持媒体查询的浏览器。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107eabb2b8.jpg)
### 19. [ResponsifyJS](http://responsifyjs.space/)
使图片真正响应式的jQuery库。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107eacdb00.jpg)
四、JavaScript排版
最后更新于:2022-04-01 06:27:47
### 13. [Plumin.js](http://www.pluminjs.com/)
使用JavaScript创建和操纵字体。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ea55145.jpg)
### 14. [Unicoder.js](http://tholman.com/unicoder.js/)
把文本转化成带有艺术效果的Unicode字符的JS库。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ea6684e.jpg)
### 15. [underline.js](http://wentin.github.io/underlineJS/)
为文字绘制了完美、俏皮的、带有动画效果的下划线的JS库。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ea7beac.jpg)
### 16. [Readable](http://mds.sh/readable/)
创建可读段落的jQuery插件。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ea8ec72.png)
### 17. [substituteteacher.js](http://danrschlosser.github.io/substituteteacher.js/)
让句子互相替换的JS库。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ea9ed88.png)
三、轮播图&画廊
最后更新于:2022-04-01 06:27:44
### 8. [ItemSlide.js](http://itemslide.github.io/)
同时支持触摸滑动以及鼠标滚动的JavaScript轮播图库。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107e9e0dff.png)
### 9. [lory.js](http://meandmax.github.io/lory/)
使用vanilla JavaScript编写的简单的触摸式滑块工具。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107e9ef115.png)
### 10. [Simple Lightbox](http://andreknieriem.de/simple-lightbox/)
同时支持移动端和PC端的jQuery灯箱效果插件。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ea0a1e7.jpg)
### 11. [Chocolat.js](http://chocolat.insipi.de/)
响应式jQuery灯箱插件。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ea1c041.jpg)
### 12. [jQuery lightgallery](http://sachinchoolur.github.io/lightGallery/)
轻量级、可定制、模块化、响应式的灯箱画廊插件。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107ea2e629.jpg)
二、导航
最后更新于:2022-04-01 06:27:42
### 4. [Elevator.js](http://tholman.com/elevator.js/)
“返回顶部”效果像真正的电梯一样。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107e974c2d.png)
### 5. [Slideout.js](https://mango.github.io/slideout/)
适用于移动端WEB应用的触摸式导航菜单。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107e990e20.jpg)
### 6. [Hammer.js](http://hammerjs.github.io/)
JavaScript 多点触控手势库。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107e9a2570.png)
### 7. [Responsible.js](http://davidwells.io/code/responsible/)
让移动端用户自由选择使用桌面端布局还是移动端布局。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107e9add58.png)
一、图形与图表
最后更新于:2022-04-01 06:27:40
### 1. [Clusterize.js](http://nexts.github.io/Clusterize.js/)
可以轻松显示大数据集的微型JavaScript插件。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107e9236db.png)
### 2. [plotly.js](https://plot.ly/javascript/)
高级、开源的图表库。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107e9374d0.jpg)
### 3. [Textures.js](http://riccardoscalco.github.io/textures/)
使用SVG元素实现数据可视化。
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107e94a30e.jpg)
前言
最后更新于:2022-04-01 06:27:38
> 原文:[speckyboy.com](http://speckyboy.com/2015/12/13/javascript-resources-2015/),由 [Specs](http://9iphp.com/) 翻译整理,发布在 [Coder资源网](http://info.9iphp.com/)
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2015-12-28_568107e906b2b.jpg)
首先在这个合集中,你可能会注意到,jQuery插件的数量相对去年来说有些减少,相反,我们更多看到的是使用原生JavaScript而不需要依赖jQuery的一些更小、更轻量级的独立JavaScript库。
我们现在需要的是更有针对性的解决方案,而不是需要一个复杂的框架,却只使用其中的一两个函数。
所有资源分为以下几个部分:图形与图表、导航、轮播图&画廊、JavaScript排版、响应式图片解决方案、图片编辑、延迟加载、表单插件、辅助工具、动画插件&库、以及最后列出的一些有用的JavaScript工具。