jQuery动画

jQuery动画animate
在我们需要实现复杂的动画时我们需要用到animate方法。animate（）方法允许我们在任意的数值的css属性上创建动画。.animate( properties ,[ duration ], [ easing ], [ complete ] )
.animate( properties, options )这2种语法使用，几乎是差不多，唯一必要的属性就是一组css的键值对。这组属性用于设置css方法的属性键值对类似，除了属性范围做了更多限制。第二个参数开始可以单独传递多个时差也可以合并一个对象传递。
Properties：一个或多个css属性的键值对所构成的object对象，要特别注意所有用于动画的属性必须是数字的，除非另有说明；这些属性如果不是数字的将不能使用基本的jQuery功能，比如常见的，border、margin、padding、width、height、font、left、top、right、bottom、wordSpacing等等这些都是能产生动画效果的。background-color很明显不可以，因为参数是red或者GBG这样的值，除非用插件，否则正常情况下是不能只用动画效果的。注意，CSS 样式使用 DOM 名称（比如 “fontSize”）来设置，而非 CSS 名称（比如 “font-size”）
complete回调： 动画完成时执行的函数，这个可以保证当前动画确定完成后发会触发
duration时间：动画执行的时间，持续时间是以毫秒为单位的；值越大表示动画执行的越慢，不是越快。还可以提供’fast’ 和 'slow’字符串，分别表示持续时间为200 和 600毫秒。
动画演示代码：

效果演示图：

动 画一执行后紫色长方形发生变化