transition,transform,animation对比

transition

其作用是：平滑的改变CSS的值。无论是点击事件，焦点事件，还是鼠标hover，只要值改变了，就是平滑的，就是动画。

transform

transform指变换，使用过photoshop的人应该知道里面的Ctrl+T自由变换。transform就是指的这个东西，拉伸，压缩，旋转，偏移。
transform属性要是加上transition的过渡特性，可谓如虎添翼。
这里有个transform的实例：transform.html

animation

animation还是只在webkit核心的浏览器上起作用。transition只能从一组css属性变成另一组css属性。animation可以在多组属性之间变换。transition必须使用触发器触发，animation可以使用触发器，也可以在页面加载完成的时候自动触发。 Animation还可以设置播放次数。

浏览器支持

• transition
  首次引入
  
  • Safari 3.2: 13/11/2008
  • Firefox 4.0: Late 2010
  • Chrome 1.0: 02/09/2008
  • Opera 10.5: 02/03/2010
• 2D transform
  首次引入
  
  • Safari 3.2: 13/11/2008
  • Firefox 3.5: 30/06/2009
  • Chrome 1.0: 02/09/2008
  • Opera 10.5: 02/03/2010
  • Internet Explore 9: 09/2010
• 2D animation
  首次引入
  
  • Safari 4.0: 11/06/2008
  • Chrome 1.0: 02/09/2008
• 3D transform
  首次引入
  
  • Safari 4.0: 11/06/2008
  • Chrome: 28/08/2010

具体详情对比请参考：transition、transform、animation