animate CSS动画程序接口（仅Chrome可用）

jQuery中很早就提供了animate方法，使用它可以很方便地实现一些简单动画效果。后来CSS3中也提供了animation用于动画效果制作，但CSS本身的可操作性太差，所以用起来并不方便。现在最新版的Chrome原生支持了animate方法，弥补了CSS的操作缺陷。
　　元素上的animate方法有两个参数。第一个参数是动画的关键帧列表，是一个数组，每一个数组项都是一个JavaScript对象，可以在上面设置这个关键帧上元素的样式属性，并且使用offset属性表示这个关键帧在整条时间轴中的位置百分比；第二个参数是动画播放的配置参数，用于描述动画的时长、播放速度、过渡方式，等参数。从CSS的角度看，这个animate方法的第一个参数就是在创建keyframes，第二个参数是为元素添加animation样式属性。整个逻辑和CSS中使用animation没什么区别。
　　下面是使用的演示：
运行<script>
onload=function(e){
  document.body.animate(
    [
      {offset:0,background:"red"},
      {offset:1/3,background:"green"},
      {offset:2/3,background:"blue"},
      {offset:1,background:"red"}
    ],{
      duration:2000,
      iterations:Infinity
    }
  );
};
</script>　　函数除了可以调用之外还有返回值，这个animate方法会返回一个AnimationPlayer对象实例，它提供了一个onfinish事件和一个cancel方法，具体作用看名字就能猜到。

　　我觉得这个方法将来会很有用，只是目前只有Chrome支持