使用过的一些前端工具

在线工具

  • JsFiddle

用于在线演示和调试前端项目

访问地址:http://jsfiddle.net/

  • CodePen

与JsFiddle类似,在国内访问速度比JsFiddle要快,JsFiddle经常被墙,需要FQ才能访问

访问地址:http://codepen.io/

CSS框架或工具

  • BootStrap

简洁、直观、强悍的前端开发框架,让web开发更迅速、简单。

访问地址:http://getbootstrap.com/

中文地址:http://www.bootcss.com/

图表工具

  • D3.js

用于将数据映射到网页上通过各种图形呈现。同时定义了很多API来操纵SVG,可以编写出很炫的效果来

访问地址:http://d3js.org/

中文资料:http://www.pkuwwt.tk/d3-tutorial-cn/about.html

  • chart.js

一个十分轻量级的图表工具

访问地址:http://www.chartjs.org/

  • HighCharts

一个功能比较强大的图表工具,支持svg,canvas

访问地址:http://www.highcharts.com/

  • Protovis

可以快速的构建图表,主要生成的是SVG动画,与D3有一定的区别

访问地址:http://mbostock.github.io/protovis/

  • ECharts

一个基于Canvas的图表工具,提供拖拽计算,大数据等功能,有详细的中文文档,出自百度前端团队

访问地址:http://echarts.baidu.com/index.html

 

JavaScript动画工具

  • Velocity.js

使用JavaScript来定义动画,性能与Css的transition和animate相当,但是更加灵活,使用上与jQuery的animate方法类似

访问地址:http://greensock.com/gsap

  • GSAP

功能很多,性能也不错,但是使用上有版权限制

访问地址:http://julian.com/research/velocity/

SVG Canvas工具

  • Raphael

可以同时生成SVG和VML格式的矢量元素

访问地址:http://raphaeljs.com/

  • Processing

可以通过Canvas绘制图形,提供了一些回调函数方便生成帧动画

访问地址:https://processing.org/

  • Snap.svg

用于生成svg,与Raphael类似,不过不支持vml,但是在使用上比Raphael方便

访问地址:http://snapsvg.io/

  • Three.js

通过Canvas展示3d模型

访问地址:http://threejs.org/

轮播图片类插件

  • OWL Carousel

支持触摸事件,响应式的图片轮播插件,支持单个图片和多个图片轮播

访问地址:http://owlgraphic.com/owlcarousel/

  • SuperSlide

由国人编写,使用上比较符合国内网站的习惯,集成了“焦点图/幻灯片”“Tab标签切换”“图片滚动”“无缝滚动”,等多种效果

访问地址:http://www.superslide2.com/

  • Jssor Slider

看上去是一个功能比较多的插件,支持多种图片切换效果,但是使用上比较复杂

访问地址:http://www.jssor.com/

  • Basic jQuery Slider

一个很轻量级的轮播插件,功能上比较单一,默认只支持单个图片的轮播,但是使用很简单,样式上也比较容易定制

访问地址:http://www.basic-slider.com/

原文地址:https://www.cnblogs.com/hsnow/p/4230460.html