前端干货,包括所有前端资源链接

一些前端开发的干货

标签(空格分隔): 资料

出处:https://coding.net/u/f2e/p/Books/git/tree/master/%E7%A7%BB%E5%8A%A8Web
包含pc端,移动端js库,框架,css框架,工具等等...在原文基础上添加修改

有些虽已经年代久远,但仍然可以学到很多有用的东西,可以整理资料的链接和其他链接资料或许有重复...... -->>另外一个链接:分享自己长期关注的前端开发相关的优秀网站、博客、以及活跃开发者 库

常用库查询系统

移动端资料

  • 支付宝无线Web开发经验谈
  • 移动前端系列——移动端页面坑与排坑技巧( 2014-12-08 )
  • 移动web最佳实践(2013)
  • 移动Web前端框架 ( 2014 )
  • 移动端自适应方案-lib.flexible,淘宝手机版都是用这个框架
  • iOS 微信 音频 视频自动播放
  • 解决ios下的微信打开的页面背景音乐无法自动播放
  • 微信JS-SDK说明文档
  • 微信js demo
  • QQ浏览器X5内核问题汇总
  • 手机分辨率查询
  • 移动端响应式框架-测试阶段,不适用于复杂页面

学习资料/文章

  • 渲染性能
  • awesome-javascript
  • JavaScript教程 - 廖雪峰的官方网站
  • Github使用指南-从新手到专家
  • node.js中文资料导航
  • 了不起的Nodejs Nodejs的各种资源,英文
  • AngularJS ,一些关于 AngularJS 的博客,文章,视频,书籍等
  • HelloSea.js seajs教程
  • HTTP API 设计指南
  • JSON API:用 JSON 构建 API 的标准指南中文版
  • 了不起的React React的各种资源,英文
  • 一家伙(s5s5)学习css3动画的心得
  • 让WEB前端的变优雅的东东,如:代码规范,代码组织,最佳实践之类
  • 前端工具推荐
  • 设计规范 -强烈推荐看
  • 腾讯团队web移动文章
  • 视觉设计师是怎样让前端工程师 100% 实现设计效果的?
  • JavaScript 秘密花园 ###书籍资料
  • 免费的计算机编程类中文书籍
  • 免费编程书籍
  • 码农周刊整理-推荐关注
  • git资料

系列文章

  • React 入门实例教程
  • React-Native学习指南
  • html5 Canvas画图系列教程目录
  • web前端开发分享-目录系列
  • 深入理解javascript原型和闭包系列
  • 深入理解JavaScript系列
  • JavaScript模式集合
  • 深入理解JavaScripts设计模式系列:
  • 设计模式总结,非js
  • 7 天打造前端性能监控系统
  • 七天学会NodeJS
  • 前端之困 · XSS CookBook系列
  • 一个月时间整理《深入浅出Node.js》
  • 【web必知必会】——图解HTTP
  • 廖雪峰-JavaScript基础教程
  • MDN JavaScript基础教程

- 45个实用的JavaScript技巧、窍门和最佳实践

其他工具

  • flexbox在线制作器
  • SPARK动画平台 这是我们组做的一个动画效果平台,里面集合了所有的牛逼动画,可以让你灵感猛增!(目前已开放外网使用)
  • OneDiv 这是个神奇的网站,里面的所有细节都是用一个div元素通过复杂的Css3实现的,有空可以去开开脑洞噢
  • 贝塞尔曲线生成器
  • HTML5 与 CSS3 技术应用评估
  • 各种奇妙的hack
  • 几乎所有设备的屏幕尺寸与像素密度表
  • 移动设备参数表
  • ios端移动设备参数速查
  • 浏览器兼容表
  • 移动设备查询器
  • 移动设备适配库
  • 移动设备适配库2
  • viewport与设备尺寸在线检测器
  • html5 移动端兼容性速查
  • 在线转换字体
  • css3 选择器测试
  • 兼容性速查表
  • 浏览器的一些独特参数
  • 各种各样的媒体查询收集
  • sass @include-media 媒体查询库 https://github.com/eduardoboucas/include-media
  • css3 动画在线制作器
  • css3 渐变在线制作器
  • 移动端手势表
  • webkit独有的样式分析
  • HTML5 Cross Browser Polyfills
  • HTML5 POLYFILLS
  • iPhone 6 屏幕揭秘
  • 智图客户端 – 你的图片你做主,本地图片快速压缩工具
  • 网站视频/音乐 扒神器 ###js插件网站
  • OpenLib--http://www.open-lib.com/
  • Query插件库--http://www.jq22.com/
  • jquery之家--http://www.htmleaf.com/
  • 分享天空--http://www.sharetk.com/
  • jQuery Script--http://www.jqueryscript.net/
  • dowebok 做好网站--http://www.dowebok.com/
  • Web前端开发--http://www.zjgsq.com/

前端组件库

搭建web app常用的样式/组件等收集列表(移动优先)

0. 前端自动化(Workflow)

  • 前端构建工具
    • Yeoman - a set of tools for automating development workflow
    • gulp - The streaming build system
    • grunt - the JavaScript Task Runner
    • F.I.S - 前端集成解决方案
  • 前端模块管理器
    • Bower - A package manager for the web
    • Browserify
    • Component
    • Duo
    • RequireJS
    • Sea.js
    • webpack
  • css预处理器
    • Less - Less is More , Than CSS
    • Sass - Syntactically Awesome Style Sheets
    • Stylus - Expressive, dynamic, robust CSS

1. 前端框架(Frameworks)

  • Material-UI 移动端ui框架,效果好 github
  • Frozen UI 腾讯移动UI框架
  • Bootstrap
  • Foundation
  • Amaze UI
  • Semantic UI
  • Pure CSS
  • topcoat
  • UIkit
  • Material UI
  • Framework7
  • mui
  • ionic framework
  • Fries
  • jQuery Mobile
  • H-ui 前端框架

    2. JavaScript 框架汇总

  • JavaScript 框架

    • react
    • Angular
    • jQuery
    • Backbone.js
    • Ractive.js
    • KISSY
    • Zepto.js
    • ZeptoBuilder是Zepto的一个在线版本,从列表中选取你想包含的文件,就能得到你自定义的构建了
    • Vanilla JS
    • Avalon
    • Sprint.js - 一个高性能、小体积的 DOM 操作库 (Benjamin De Cock)
    • JSLite.js
  • 轻量级JavaScript框架
    • Min.js - Super minimal selector and event library
    • skel.js - A lightweight responsive framework
    • [LAB.js 异步加载js]
  • JavaScript 工具库
    • underscore.js
    • Way.js - 双向数据绑定库
    • Keys.js - 应用快捷键
    • Mousetrap - 键盘快捷键操作
    • Vue.js - 数据驱动的组件化MVVM库
    • 移动web开发调试工具AlloyLever介绍 - 打印信息 -vConsole.js 同上

3. 前端游戏框架(动画引擎)

  • Pixi.js 3.0.7 - WebGL 国外游戏引擎 https://github.com/pixijs/pixi.js
  • cocos2d-html5
  • Egret Engine
  • LimeJS
  • EaselJS
  • three.js
  • AlloyStick
  • The-Best-JS-Game-Framework
  • CanvasEngine
  • Quintus
  • LayaAir 引擎 国内游戏框架,跟白鹭比较??暂时不知道
  • soya2d 一个 好学、易用、强大、开源的 H5游戏引擎 现在,有你掌控

4. ui组件库

  • GMU - 基于zepto的ui组件库,适用于移动端
  • FrozenUI - 腾讯移动端组件库
  • NEC
  • NEJ
  • Pure CSS Components
  • magic-of-css
  • Primer - The CSS toolkit and guidelines that power GitHub
  • ZUI - 一个开源前端实践方案,帮助你快速构现代跨屏应用。
  • WeX5开源前端
  • B-JUI
  • MUI 轻量级WEB框架
  • jQuery WeUI - V0.7.1 WeUI 的jQuery实现版,提供了大量官方WeUI没有的组件, 同时兼容 jQuery 和 Zepto。
  • Light7 手机ui组件

5. 基础模版

  • 浏览器统一(Cross Browser)
    • HTML5 BOILERPLATE
    • Modernizr
    • Normalize.css
    • cssFx - 为CSS3自动生成浏览器前缀
    • -prefix-free - Break free from CSS prefix hell
  • 响应式
    • Responsive - 响应式布局
    • Enquire.js - Awesome Media Queries in JavaScript
    • Free Wall - 创建桌面,移动和平板的动态网格布局

6. 排版

  • yue.css
  • typo.css
  • chinese-copywriting-guidelines - 中文文案排版指南

7. 网格系统

  • grid
  • Flexbox Grid
  • MasonJS - creating a perfect grid
  • Juiced: a Flexbox CSS Framework
  • Neutron 创建灵化、简洁网页布局的SASS框架
  • flexible.gs 灵活的响应式栅格布局CSS框架
  • Decorator - HTML, CSS, and JavaScrip 前端框架
  • minigrid.js 只有2KB的零依赖栅格布局-瀑布流

    8. HTML5 API 应用

  • History.js - gracefully supports the HTML5 History/State APIs

  • jquery-pjax - pushState+ajax
  • jquery-address - Deep Linking
  • Notify.js(Web Notifications API)

9. UA 识别

  • detector

10. 表单处理

10.1 表单验证(Form Validator)/表单提示
  • Validator
  • Parsley
  • jquery.form.js - jQuery Form Plugin
  • Validform
  • validator.js
  • jquery-validation - jQuery Validation Plugin
  • formvalidator.js
  • Fort.js – 表单填写进度提示
  • mailcheck - 用于检测email地址的域名
  • Floatlable.js - 输入时显示placeholder文本
  • jQuery Label Better
10.2 < select > 相关
  • Chosen
  • Select2
  • bootstrap-select
10.3 单选框/复选框相关
  • iCheck - 增强复选框和单选按钮
10.4 上传组件
  • jQuery File Upload Plugin
  • 百度 Web Uploader
  • Uploadify
  • Plupload
  • Fine Uploader
  • arale-upload - 轻量级 iframe and html5 file uploader
  • Dropzone.js - drag'n'drop library拖拽上传
  • flow.js
  • localResizeIMG3 - 前端本地客户端压缩图片,兼容IOS,Android,PC
  • FileAPI - 是文件上传(单个/多个)、拖放支持、图像裁剪、大小调整、应用过滤器和获取文件信息 -Resumable.JS 通过HTML5API提供了稳定可恢复的多文件上传功能。

    10.5 日期选择
  • Both Date and Time picker widget based on twitter bootstrap

  • GMU 日历组件
  • Mobiscroll
  • Pikaday - 日期选择器
  • TimelineJS - 时间轴

    10.6 取色
  • Colorpicker plugin for Twitter Bootstrap

10.7 标签插件(Tag)
  • TaggingJS – 可以灵活定制的 jQuery 标签系统插件
  • selectize.js
10.8 自动完成插件
  • At.js - 一个Twitter/微博样式的@自动完成插件
  • jquery-textcomplete - 智能搜索提示框/自动补全
  • typeahead.js - a fast and fully-featured autocomplete library
  • Awesomplete - 零依赖的简单自动完成插件 - github
10.9 样式修正
  • autosize - 使文本框自动适应所输入的内容

11. 图表绘制/图形库(Graphics)

  • Highcharts
  • Chart.js - 基于HTML5的JavaScript图表
  • 百度 ECharts
  • Chartist.js
  • D3.js - A JavaScript visualization library for HTML and SVG.
  • intro-to-d3 - a D3.js tutorial
  • Bonsai - 一个功能强大的JavaScript图形库
  • Epoch - 漂亮、平稳流畅和高性能可视化的图表库
  • SVG 2D绘图
  • SVG Morpheus - SVG图形变形动画

    12. 日期格式化

  • Moment.js - 日期处理

  • Smart Time Ago - 显示相对时间
  • FormatJS – 让你的 Web 应用程序国际化 ####13. 页面交互
13.1 Slider
  • slick - the last carousel you'll ever need
  • Swipe - the most accurate touch slider
  • Swiper - 移动端/pc端滑动组件比较强大 - github
  • iscroll - 简约模拟滑动层
  • iSlider - 移动端滑动组件
  • OwlCarousel - create beautiful responsive carousel slider
  • jquery-mousewheel - jQuery鼠标滚轮滚动侦测插件
  • Glide.js - 轻量级滑块组件
13.2 瀑布流
  • Masonry
  • Isotope - Filter & sort magical layouts
13.3 懒加载/加载监听/预加载
  • layzr.js - git关注蛮高的 - github
  • imagesLoaded
  • Echo.js
  • lazySizes
  • jquery_lazyload
  • BttrLazyLoading
  • lazyload.js
  • waitForImages - 图片加载监听库
  • PxLoader - JS预加载库:实现图片、声音等各种文件的预加载功能
  • jQuery.preload - 预加载图片资源
  • bindWithDelay - jQuery Plugin For Delayed Event Execution
  • TypeWatch - 停止输入时调用
13.4 图片轮播(幻灯片)/图片展示
  • SuperSlide - 国产的幻灯片,功能集成比较多,我个人推荐
  • FlexSlider
  • unslider - 小而美的轮播库
  • prettyPhoto
  • FlickerPlate - A cool jQuery plugin that lets you flick through content.
  • Holder.js - Client-side image placeholders.
  • RowGrid.js - 在径直的行里放置图片
  • ImageLightbox.js - 灯箱效果
  • JQuery Panorama Viewer - 全景视图
  • PhotoSwipe - 移动开发必备的 iOS 风格相册 - github
13.5 图片剪裁/图片处理
  • Jcrop - Image Cropping Plugin for jQuery
  • croppic - an image cropping jquery plugin
  • jQuery.eraser - 图像擦除插件
  • DD_belatedPNG.js - 让IE6支持透明PNG图片
  • FocusPoint.js 实现图片的响应式裁剪
  • Picturefill - 一个响应式图片 JS 插件 (Scott Jehl)
  • jQuery picZoomer - 图片区域放大
  • watermark.js 为图片添加水印

    13.6 进度条/加载动画(Loading)
  • NProgress.js

  • progress.js
  • Pace - Automatic page load progress bar
  • jquery-ajax-progress
  • waitMe - 很漂亮的loading效果
  • spin.js
  • sonic.js
  • fakeLoader.js - 依赖jQ的全屏加载js

    13.7 侧滑插件(offcancas)
  • pushy - a responsive off-canvas navigation menu

  • Slideout.js - 一个用于移动 Web 应用的触摸滑出式导航菜单
13.8 菜单(Menu)
  • SuperFish - 基于jQuery的级联下拉菜单
  • Responsive Nav - 响应式导航
13.9 滚动侦测(ScrollSpy)
  • jquery-scrollspy(1)
  • jquery-scrollspy(2)
  • Waypoints
  • ScrollMagic - 像进度条一样使用滚动条
  • onScreen - 滚动加载,滚动固定
13.10 滚动加载更多/下拉刷新(Pull to Refresh)
  • jScroll
  • web-pull-to-refresh
  • pulltorefresh
  • RubberBand.js - add pull-to-refresh functionality to any page.
  • infinity.js/∞ .js 无限下拉加载
13.11 平滑滚动插件(Smooth Scroll)
  • jquery-smooth-scroll
  • jquery.scrollTo - 平滑滚动到页面指定位置
  • smooth-scroll
  • scrollUp
  • Elevator.js 一个模拟电梯运行“返回顶部”的 JS 插件 (Tim Holman)
13.12 全屏滚动/全屏切换
  • pagePiling.js - 全屏滚动效果
  • fullPage.js
  • onepage-scroll
  • zepto.fullpage - 专注于移动端的fullPage.js
  • screenfull.js - 切换全屏模式
  • Space.js – HTML 驱动的页面 3D 滚动效果 - github
13.13 分屏滚动
  • multiscroll.js - 分屏滚动效果
13.14 转场效果
  • Animsition - 页面切换时的过渡效果
13.15 固定元素(Sticky)
  • Sticky-Kit 比较出名,功能强大,个人推荐
  • Sticky Navbar -可定点
  • Waypoints
  • sticky - jQuery Plugin for Sticky Objects
  • jquery.pin - 固定页面元素
  • stickUp
  • Slinky.js - 堆叠头部创建滑动导航列表
  • Headroom.js
  • ScrollMagic
  • Sticky Float
  • Sticky Mojo
  • Zebra Pin
  • HC-Sticky
13.16 触控事件
  • Hammer.js
  • jquery.event.move.js
13.17 拖拽组件
  • Draggabilly - 专注于拖拽功能的 JS 库
13.18 隐藏或展示页面元素
  • Headroom.js - 在不需要页头时将其隐藏
  • Readmore.js - 内容显示与隐藏插件
  • oriDomi - 像指一样折叠Dom元素
13.19 滚动条(Scrollbar)
  • jQuery-slimScroll pc效果不错5k,手机端不建议是用
  • jquery.mCustomScrollbar pc,苹果效果不错,安卓效果略差,大小较大
  • jScrollPane
  • jquery.scrollbar
  • perfect-scrollbar
  • nanoScrollerJS
  • tinyscrollbar
13.20 视差滚动(Parallax Scrolling)
  • MidnightJS 效果很赞
  • parallax.js
  • jparallax
  • StickyStack.js -github
  • jquery.superscrollorama.js 很酷的动画效果

14. 代码高亮插件/代码编辑器

  • google-code-prettify
  • highlight.js
  • Rainbow
  • ACE
  • CodeMirror
  • Crayon Syntax Highlighter
  • prism - Lightweight, robust, elegant syntax highlighting.

15. UI Icon 组件

  • Font Awesome
  • Glyphter: The SVG Font Machine
  • Perfect Icons
  • iconizr
  • Cikonss - 纯CSS实现的响应式Icon
  • Simple Icons

16. 动画(Animate)

  • js动画库

    • GSAP.js 最屌的动画库
    • Animate Plus CSS/SVG 动画库
    • anime.js 最近出的动画库,支持svg
    • dynamics.js js动画-很屌的样子,支持svg
    • snabbt.js - 简约的JavaScript动画库
    • Transit - CSS transitions and transformations for jQuery
    • Move.js - 简化CSS3动画的JS库 - github
    • Animo.js - 堆栈动画,创建跨浏览器的模糊效果【效果不错,依赖jq】 - github
    • Velocity.js - 加速JavaScript动画
    • Morf.js 提供了一组 JavaScript 方法用于加速 CSS3的各种转换效果,支持的方法都在上图中,无需编写 CSS3 代码。 - github
    • lenticular.js - 响应倾斜或鼠标事件创建图片动画
    • jQuery Interactive 3D - 使用图片创建一个3D模型
    • AnimateScroll - 动画滚动,应该是定点导航动画
    • jq 元素抖动库
    • Tween JS JavaScript 补间动画库 canvas
    • Rekapi 关键帧动画库
    • favico.js v0.3.4 控制游览器标签小图标 - github
    • dom-animator -注释动画
  • css动画库

    • xless - 又一个css动画库 github
    • CSShake - css抖动库 - github
    • animate.css - css3动画库
    • all animation - 同上,有sass版本 - github
    • magic - CSS3动画特效 - gihub
    • ScrollMe – 在网页中加入各种滚动动画效果
    • Loaders.css - css加载动画 - github
    • css-loaders - 同上
    • Hover.css - github
    • Effeckt.css - 手机动画库
    • NEC动画库
    • uilang - a minimal, ui-focused programming language for web designers
    • csshake 带有sass版本
    • AniJS - 一个基于声明式语法的CSS动画库
    • SpinKit ??
    • JX.Animate - 腾讯css3动画库 - github

17. 本地存储

  • cross-storage - Cross domain local storage
  • localForage
  • pouchdb
  • basil.js

18. 模板引擎

  • vue.js ie9+
  • paperclip.js ie8+
  • mustache.js
  • Handlebars.js
  • artTemplate
  • baiduTemplate
  • JSRender
  • EJS - JavaScript Templates
  • Juicer - A Light Javascript Templete Engine.
  • Tempo
  • json2html

19. 通知组件/弹框组件/模态窗口

  • layer.js - 国产,也是集成很多功能,个人推荐
  • AnimatedModal.js - CSS3 全屏模态窗口,支持 Firefox、Chrome、Safari、Opera 和 IE 10+
  • alertify.js
  • AlertifyJS
  • SweetAlert
  • Messenger - 非常酷的弹框组件
  • PNotify
  • Notify.js - A simple, versatile notification library
  • Remodal - 模态窗口插件

20. 提示控件(Tooltips)

  • qTip2 - Pretty powerful tooltips
  • tooltip - CSS Tooltips
  • tooltipster - A jQuery tooltip plugin
  • grumble.js - 气泡形状的提示(Tooltip)控件
  • Ouibounce - 离站提示控件

21. 对话框/遮罩层/弹出层(lightbox)

  • fancyBox - Fancy jQuery lightbox
  • jquery-lightbox - The popular lightbox script, ported to jQuery
  • Colorbox - a jQuery lightbox
  • artDialog - 经典的网页对话框组件
  • DialogEffects
  • jQuery blockUI - Page or element overlay

22. 文档/表格/PDF

  • handsontable - 在线可编辑excel表格
  • jQuery Bootgrid - 用于ajax生成动态表格
  • DataTables - Table plug-in for jQuery
  • PDF.js - 一个 JavaScript 编写的 PDF 阅读器
  • jsPDF - Generate PDF files in JavaScript
  • Recline.js - 灵活操作和展示数据
  • Dynatable - 交互式表格插件

23. 目录树插件

  • zTree_v3 - jQuery Tree Plugin
  • jstree - jQuery Tree Plugin
  • fancytree - Tree plugin for jQuery

24. Ajax模块

  • fetch - A window.fetch JavaScript polyfill
  • reqwest - browser asynchronous http requests
  • minAjax.js

25. 音频/视频

  • jWebAudio
  • jPlayer - HTML5 Audio & Video for jQuery
  • video.js - HTML5 & Flash video player
  • Accessible HTML5 Video Player - PayPal 开源的 HTML5 视频播放器
  • Clappr - 开源的Web视频播放器
  • Plyr - 简单,灵活的 HTML5 媒体播放器
  • FitVids.js - A lightweight, easy-to-use jQuery plugin for fluid width video embeds.
  • BigVideo.js - The jQuery Plugin for Big Background Video
  • BigScreen - A simple library for using the JavaScript Full Screen API
  • Vide - 视频背景
  • winamp2-js
  • Buzz - A Javascript HTML5 Audio library
  • howler.js 是一个新的 JavaScript 库用于处理 Web 的音频,该库最初是为一个 HTML5 游戏引擎所开发,但也可用于其他的 Web 项目。

26. 按钮

  • Buttons - A CSS button library
  • ButtonComponentMorph
  • ProgressButtonStyles
  • CreativeButtons
  • CSS3 buttons
  • jquery.onoff - Interactive, accessible toggle switches for the web.

27. 富文本编辑器/Markdown编辑器/Markdown解析器

  • Simditor - 简单快速的富文本编辑器
  • BachEditor - 一个有情怀的编辑器
  • Squire – 简洁的 HTML5 富文本编辑器
  • TinyMCE
  • bootstrap-markdown
  • marked - markdown解析器
  • Markdown Plus
  • Editor.md - 开源在线Markdown编辑器

28. 内容提取(Readability)

  • Readability
  • json.human.js - Json Formatting for Human Beings

29. 颜色(CSS Colors)/SVG

  • CSS Colours
  • SVGeneration
  • SVGMagic - 自动的创建PNG来兼容不支持SVG的浏览器
  • Adaptive Backgrounds - 从图片抽取主要颜色和应用到父元素

30. 选项卡(Tabs)

  • Easy Responsive Tabs to Accordion
  • Responsive-Tabs
  • ion.tabs - jQuery tabs plugin
  • jQuery-EasyTabs

31. 文本处理

  • ZeroClipboard - 文本复制插件
  • Bigfoot - 点击文章中的脚注弹窗显示
  • Annotator - 文本注解插件,可以包括注释、标签、用户等
  • Succinct - 用作截断多行文本,后面添加省略号
  • Flowtype.js - 自动调整字体大小和行号
  • flat-shadow
  • FitText - A jQuery plugin for inflating web type
  • Squishy 是一个jQuery插件,它能自动调整文字,准确地对其各容器
  • slabText 一个jQuery插件,用于创建大的,大胆的和敏感的头条新闻。
  • Textillate 做CSS3文字动画。
  • Bacon 是一个jQuery插件,它允许您环绕贝塞尔曲线文字或线条,它可以让您的文字沿贝塞尔曲线排列。
  • Circletype.js 是一个很小的( 2.7kb )的jQuery插件,可以让你的字体在一个圆圈内显示。
  • jQSlickWrap 是一个jQuery插件,让您可以轻松而准确地环绕浮动图像里的内容文字。
  • TypeButter 使您能为您的字体设置透明度和字间距。

32. 布局(Layout)

  • 分隔面板(Split Panel)
    • split-pane

33. 实用工具/其他插件

  • jquery-cookie
  • FastClick - 处理移动端 click 事件 300 毫秒延迟
  • Async.js - 异步操作
  • html2canvas - 实现纯JS网页截图
  • jquery.qrcode.js - 生成二维码的 jQuery 插件
  • nakedpassword - 用脱衣女帮助检测密码强度
  • KityMinder - 脑图编辑工具
  • MixitUp - 动画过滤和排序
  • JQuery Tip Cards - 创建卡片交互的cards布局
  • Fallback.js - JavaScript library for dynamically loading CSS and JS files.
  • swfobject

34. sass 库

  • Family.scss - css3选择器简写框架,非常不错
  • SpaceBase – 基于 Sass 的响应式 CSS 框架 - github
  • breakpoint-sass 媒体查询库
  • @include-media diy媒体查询库
  • sass-mediaqueries 媒体查询库-推荐 -demo
  • sass-mq Media Queries with superpowers-em单位媒体查询库

34.1 分页

  • jqPagination 分页插件

35. 未知分类

  • Rainyday.js - 实现雨滴效果
  • Reveal.JS - 替代PPT,演示文稿。
  • Gif.JS 是一个能运行在你的浏览器中的JavaScript GIF编码器。
  • Sir Trevor是一个会完全重绘网页内容的工具:直观的编辑网页内容而不用假定任何关于它是如何重绘的事。
  • feature.js 检测浏览器是否支持某属性
  • Mock.js 生成随机数据,拦截ajax
  • BookBlock 翻书特效 - github
  • intro.js 引导用户页面
  • CSS滤镜 CSSgram
  • Transformicons - CSS/SVG 元素模拟 图标/符号动画-过渡
  • CSS 滤镜在线调试
  • glfx.js canvas图片处理滤镜
  • Crayon.css CSS颜色变量名与16进制对应列表。
  • SVG圆形菜单生成器
  • 优化和配置SVGO的WEB应用
  • CSS单位对比视图
  • 使用GUI快速创建SVG path
  • 把CSS代码转成SASS的应用
  • resizr 测试 CSS media queries 的轻量级应用-需要线上地址,没有线上地址,可以搞个coding-git
  • 在线ppt

    36. Canvas库

    • jCanvas - 语法简单实现canvas的js 库

    - create.js

前端参考集

  • frontend-guidelines - Some HTML, CSS and JS best practices.
  • Codrops - Useful resources
  • Front-end Code Standards & Best Practices
  • frontend-dev-bookmarks
  • Airbnb 的 JavaScript 编码规范
  • Clusterize.js 可以优化你的大型数据表格的性能 还有一大波干货待整理...

欢迎分享你的好东西给我

发布时间:2015-4-17日

修正更新时间:2016-4-12日

你可能感兴趣的:(前端干货,包括所有前端资源链接)