在月初的时候，发了CSS3热身实战--过渡与动画（实现炫酷下拉，手风琴，无缝滚动）。js的代码库也发过两次，两篇文章。之前也写了css3的热身实战，既然热身完了，是时候开始封装css3的代码库了，相比起js的代码库，css3的代码库的逻辑性就更加简单了！可以说只要打上注释和一张…

10 个独特的 CSS 背景视觉效果

使用 GreenSock 来制作有趣的 SVG 动画

今天我们来讲述css3能够做成动画的最小独立单元,并且讲述如何使用这些独立的单元来构成一个‘高大尚’的组合动画。 这是我在网上找的一个案例，修改后的效果图，虽说不是特别的‘高大尚’，但我认为这也跟高大尚占了一点了，中间的菜单按钮就是我们在做responsive开发时会用的到的效…

SVG 格式在 WEB 开发中有着广泛的应用，在使用 SVG 创建图标后，人们通常会为之增加一些简单动画：鼠标悬浮改变颜色透明度；利用 transform 旋转角度缩放尺寸；鼠标点击切换图标等，但这些简单动画并不过瘾。本文以「播放」和「暂停」图标切换为例，讲述如何创建图标变形动画，让图标切换更酷炫更平滑。

令人愉悦的动效几乎已经成为如今网页设计的标准配置了，融入动效的交互细节让现代网页同以往的设计在根本上区别开来。动效不仅可以表现状态，引导用户的关注点，帮助用于预测交互的结果，甚至影响用户的行为。 在逐步的探索和发展过程中，动效在网页和 APP 中的运用方法与技巧已经逐步成熟，形成了一套相对系统的模式。今天的文章我们通过一系列实例，来展示一下动效是如何改善整个用户体验的。

Alloyteam 的这篇文章写得很好，思路清晰，实用性强，推荐一下~

SVG 动画精髓