开发者

What are the differences among the vendor prefixed 'requestAnimationFrame' implementations?


EDIT: This question is now of only historical interest:

It appears that vendor prefixes and vendor-specific behavior have been dropped.

Feel free to ask a question about how to emulate the old vendor-specific behavior, if you like.


Chrome, Firefox, Internet Explorer and Opera may have different functions for requestAnimationFrame, respectively:

  • webkitRequestAnimationFrame
  • mozRequestAnimationFrame
  • msRequestAnimationFrame
  • oRequestAnimationFrame

The specification is pretty clear about what behavior they should share, but does anyone have an authoritative answer on how they differ?

EDIT: for the time being, I'm accepting my own answer. I am still interested in the details of IE 10's implementation and, should Opera implement it, Opera's; I'll update the question should there be any s开发者_开发技巧ignificant differences.


Maybe the best page for complete explanation is this one.


The best resource I've found is

https://developer.mozilla.org/en/DOM/window.requestAnimationFrame

which only addresses webkit and moz variations.

moz: you may call requestAnimationFrame with no arguments; this will cause MozBeforePaint events to be fired when the browser is ready to draw an animation frame.

window.mozRequestAnimationFrame();
window.addEventListener("MozBeforePaint", function(event){
  //event.timeStamp has the next repaint time
  /* animation code here*/
}, false); 

webkit: you may call requestAnimationFrame with a second argument, which should be the DOM element being animated; this will cause your animation function to only be called when that DOM element is visible.

(for Chrome) Example: you can tell that it works by opening up the console and observing that log messages emitted by the animation function are only generated when the canvas is visible.

This leaves the Opera and IE variations unaddressed.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜