Question

我使用requestAnimationFrame方法为画布设置动画。对于不受支持的浏览器，我使用的是polyfill

//I am only posting code for polyfill. 
//Actual code uses methods for webkit, mozilla and other browsers too
if(!window.requestAnimationFrame){
    requestAnimationFrame = function(callback){
         return window.setTimeout(callback, 1000/60);
    }
}

我的动画代码是

//AnimationCanvas is a canvas with static image of the speedometer
//drawPointerOnCanvas method will draw the pointer
animate = function(context, animationCanvas){
      context.drawImage(animationCanvas, 0, 0);
      drawPointerOnCanvas();
      requestAnimationFrame(this.animate);
}

我想连续制作动画，但是polyfill会在Android OS 4.1和4.2中使动画随机化。我的要求类似于以下MDN链接中的时钟 https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Basic_animations#An_animated_clock

注意：我的实际要求是速度表。如果我改变速度，它应该平滑地动画到那一点。

问题：是否有可靠的polyfill或后备可用？因为如果我使用 requestAnimationFrame 方法，动画会很流畅。但是如果使用polyfill，动画是随机的。

编辑：我通过切换IE11的控制台检查了IE9，动画很流畅。这可能与Android设备中的内存（RAM）和处理器速度有关吗？

通过RequestAnimationFrame polyfill进行动画是随机不均匀的

0 个答案: