logo头像

总有人间一两风,填我十万八千梦

前端优秀插件推荐

这里集中了一些我在项目中或平常看到听到的好的插件,话不多说,直接干货:

插件名称描述地址备注依赖
turn.js能够将HTML内容组织成看起来像一本真正的书籍或杂志,用到HTML5的所有优点Github | 官网可以工作在旧浏览器中比如:IE 8
Tdrag拖拽的插件,可以拖拽任意元素Github | DemojQuery
tagsinput动态标签生成,并添加了删除按钮和其他好看的样式Github | 官网 | DemojQuery
slimScroll支持把内容放在一个盒子里面,固定一个高度,超出的则使用滚动。Github | Demo不过不支持resize的时候重新调用插件,有一个贡献者已经修改过源码,不过作者并没有加进去。插件项目地址:插件地址(插件不支持IE7)jQuery
scratchit.js一款基于HTML5 canvas的jQuery刮刮卡效果插件。这个刮刮卡效果使用两张图片和canvas来制作,可以使用鼠标擦除上面的图片,将下面的图片显露出来,模拟现实的刮刮卡效果Demo可以用来做手机游戏刮刮卡,亲测可用jQuery
myFocus可以实现图片轮播,风格多种多样官网 | Demo没有 Github 地址,因为人家是用 SVN 的
move.js模拟CSS3动画的js插件。该插件可以完成CSS3的各种动画效果:移动、变形、倾斜、背景色渐变、旋转等。并且可以在动画中使用各种easing效果Github | DemojQuery
mCustomScrollbar滚动条样式插件,可以自由的定制自己喜欢的滚动条Github | 官网 | Demo兼容IE6和IE7等的浏览器
Lightbox实现图片浏览效果,具有的功能包括:自动根据窗口的大小缩放图片,模式窗口,幻灯片方式播放,内容预加载,渐变等效果Github | 官网 | Demo有基于 jQuery 的,有基于 Prototype 的,也有使用原生 JavaScript 写的
html2canvas将html的内容以canvas形式生成图片,亲测好用Github | 官网 | Demo
gridly一个 jQuery 插件,它能够拖动,删除和调整一个网格的大小,亲测好用Github | 官网 | DemojQuery
FullPage可以做出全屏网站Github | Demo兼容桌面端(ie5.5+) 和手机端
fine-uploader采用 ajax 方式实现文件上传,同时在浏览器中直接支持文件拖拽Github | 官网 | Demo对浏览器版本有要求类似 IE 版本必须是 9 或是更高的 IE10
csshake-masterCSS3 元素抖动动画库Github | 官网 | Demo
ajaxfileupload一个异步上传文件的 jQuery 插件GithubjQuery
animate.css齐全的 CSS3 动画库Github | Demo
css3d-engineCSS3d 动画,主要是在 transform 上做文章Github | 官网 | Demo可以用来做720度或320度全景,亲测可用
hammer.js可以完美的实现在移端开发用到的大多数事件,如:点击、滑动、拖动、多点触控等事件Github | 官网 | Demo
iscroll.js移动端广泛应用的插件之一,用于让元素在固定高度盒子内滚动Github | 官网 | Demo版本 4 还包括缩放、拉动刷新、精确捕捉元素、自定义滚动条等功能jQuery
touchSwipe.js和 hammer.js 类似,同样是移动端触屏触摸特效插件Github | 官网 | Demo有一个 bug:手指事件会在 a 标签超链接内失效jQuery
jquery.validate表单验证插件,非常方便实用Github | 官网 | DemojQuery
jstween将某一个元素粒子化Github | Demo具体应用还未尝试,但是该插件的作者有许多优秀的项目,可以 follow 一下
DlHighlight代码高亮脚本,只支持 4 种编程语言:JS、CSS、XML、HTMLGithub | 官网 | DemojQuery
支付宝打赏 微信打赏

听说赞过就能年薪百万