anchor.diff:    transition actually begins. We can define one by adding it in the same string
     following the duration. It also has the same format options as the duration:
   
  -  延迟控制在动画已经被触发，但尚未真正开始转场之前要等待多久。我们可以把它添加到字符串中的持续时间后面，它的选项格式也跟持续时间是一样的：
  +  延迟控制的是在动画已经触发但尚未真正开始转场之前要等待多久。我们可以把它添加到字符串中的持续时间后面，它的选项格式也跟持续时间是一样的：
   
     * Wait for 100ms and then run for 200ms: `'0.2s 100ms'`
   
     * 等待100毫秒，然后运行200毫秒：`'0.2s 100ms'`。
   
     ### Easing
  +
     ### 缓动函数
   
     The [easing function](http://easings.net/) controls how the animation accelerates
  
positive.code:   Using the `void` and `*` states we can define transitions that animate the
    entering and leaving of elements:
  
    使用`void`和`*`状态，我们可以定义元素进场与离场时的过渡动画：
  
    * Enter: `void => *`
  
  
negative.code:   can control the easing by adding it as a *third* value in the string after the duration
    and the delay (or as the *second* value when there is no delay):
  
    [缓动函数](http://easings.net/)用于控制动画在运行期间如何加速和减速。比如：使用`ease-in`函数意味着动画开始时相对缓慢，然后在进行中逐步加速。我们可以通过在这个字符串中的持续时间和延迟后面添加*第三个*值来控制使用哪个缓动函数(如果没有定义延迟就作为*第二个*值)。
  
    * Wait for 100ms and then run for 200ms, with easing: `'0.2s 100ms ease-out'`
  
    * 等待100毫秒，然后运行200毫秒，并且带缓动：`'0.2s 100ms ease-out'`
  
    * Run for 200ms, with easing: `'0.2s ease-in-out'`
  
    * 运行200毫秒，并且带缓动：`'0.2s ease-in-out'`
  
  figure
    img(src="/resources/images/devguide/animations/animation_timings.gif" alt="Animations with specific timings" align="right" style="width:220px;margin-left:20px" )
  