10个顶级的CSS和Javascript动画框架推荐

在网站中嵌入动画已成为近年来的一个设计趋势,许多公司都已开始转向并拥抱HTML五、CSS3和JavaScript这个技术“三人组”。尽管这些技术还不能制做一些很是复杂的动画(像flash所实现的),可是若是拥有好的想法及创造性思惟,使用它们制做的即使是一些简单的动画也足以打动咱们。 

并且,随着CSS3技术的发展,CSS3动画日益流行。目前,WebKit浏览器已对CSS3动画支持得至关好。Firefox已经打算采用Webkit代码,IE 10中也会加入Webkit支持。 

本文介绍一些JavaScript和CSS动画框架,我的认为至关实用,但愿它们能帮助你建立出使人着迷的用户体验。 

1. jQuery Transit 

css


该jQuery插件扩展了jQuery的动画功能,增长了许多CSS3特性,如rotata(旋转)、skew(扭曲)、scale(缩放)等。 

2. Transform.js 

jquery


这也是一个jQuery插件,不过它扩展的是animate()与css()方法的功能。经过其引入的CSS3属性你能够完成一系列的动画效果。 

3. Paper.js
 

git


Paper.js是一个开源的矢量图形脚本框架,运行于HTML5 Canvas(画布)之上。它提供了一个整洁的场景图(Scene Graph)或文档对象模型来建立矢量图形,而且拥有许多强大的功能,能够生成贝赛尔曲线等。全部这一切都经过一个精心设计的整洁一致的编程接口封装了起来。 

4. Move.js 

github


Move.js是一个小巧的JavaScript库,能够建立很是简单而优雅的CSS3动画。 

5. JSAnim 

编程


jsAnim是一个强大却易于使用的JavaScript库,绝对可让你建立使人惊叹的动画效果,而不会影响项目的可用性。它只有不到25KB,但却很是强大。 

6. GX 

浏览器


GX是一个功能完善的、跨浏览器的超轻量级(未压缩状态下只有10KB)JavaScript动画框架。使用GX框架,你能够利用全部的W3C CSS属性来建立复杂动画效果。 

7. Animatable 

app


纯粹的CSS3动画方案。这里有一个demo,你能够看见使用它能实现什么样的动画效果。 

8. Animate.css 

框架


Animate.css是一个可直接用于项目的有趣的、跨浏览器动画方案,包括一个纯粹的CSS3动画库及一些预约义的动画片断。 

9. $fx 

函数


一个轻量级的JavaScirpt动画库,对JavaScript DOM函数进行了扩展。它体积很小(只有3.7KB)——健壮的实现,较低的学习成本,总之$fx是一个不错的选择。 

10. Scripty2 

学习

Scripty2是一个强大灵活的JavaScript框架,可让你编写属于本身的“可视化大餐”或者使人深入的用户界面。它是Flash的竞争对手。 

相关文章
相关标签/搜索