jQuery之模拟实现$().animate()(下)

前言:
在上篇的基础上,接入doAnimation()

逻辑图:

jQuery之模拟实现$().animate()(下)_第1张图片

实现:




  
  jQuery之$().animate()的实现




这是A

运行结果:

jQuery之模拟实现$().animate()(下)_第2张图片

解析:
(1)单个动画本身也有循环,也就是利用requestAnimationFrame循环动画帧,从而绘制动画
(2)当percent<1 时,即动画运行时间小于总体时间,就不断运行动画帧;当percent=1 时,表示动画结束,通知动画队列,运行下个动画,如此循环即可


(完)

你可能感兴趣的:(jQuery之模拟实现$().animate()(下))