web动画的方式requestAnimationFrame

来源：互联网发布：如何下载开票软件编辑：程序博客网时间：2024/05/19 16:37

转载：http://www.cnblogs.com/Wayou/p/requestAnimationFrame.html

在性能上，requestAnimationFrame > setTimeout > setInterval。具体原因大家可以找找相关的资料了解一下。而setTimeout的最小定时值为100/60

我们在实现运动时，从性能与兼容性两方面考虑，常常会如下声明：

var lastTime = 0,    nextFrame = window.requestAnimationFrame       ||                window.webkitRequestAnimationFrame ||                window.mozRequestAnimationFrame    ||                window.msRequestAnimationFrame     ||                function(callback) {                    var currTime = + new Date,                        delay = Math.max(1000/60, 1000/60 - (currTime - lastTime));                    lastTime = currTime + delay;                    return setTimeout(callback, delay);                },    cancelFrame = window.cancelAnimationFrame               ||                  window.webkitCancelAnimationFrame         ||                  window.webkitCancelRequestAnimationFrame  ||                  window.mozCancelRequestAnimationFrame     ||                  window.msCancelRequestAnimationFrame      ||                  clearTimeout;

0 0