动画实际上就是在一定时间内,改变一个元素的某些属性。

这里简单实现一个JavaScript运动的框架。主要包括:

  1. 速度动画(改变left、right、width、height、opacity)

  2. 缓冲运动

  3. 多物体运动

  4. 任意属性值改变

  5. 链式运动

  6. 多属性同时变化

速度动画

速度动画就是通过改变left、right、width、height、opacity的值来达到动画效果。我们先写一个简单的HTML结构:

<div id="div1">
    <span id="share">分享</span></div>

具体CSS样式效果如下图: