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 significant differences.

有帮助吗?

解决方案 2

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.

其他提示

Maybe the best page for complete explanation is this one.

许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top