HTML and CSS Reference
In-Depth Information
REQUESTANIMATIONFRAME()
The
best
way to create an animation loop is by using the brand-new
win-
dow.requestAnimationFrame()
method.ThisnewmethodusesadeltatimertotellyourJavaScript
program exactly when the browser is ready to render a new frame of animation. The code looks like
this:
window
.
requestAnimFrame
=
(
function
function
(){
return
return
window
.
requestAnimationFrame
||
window
.
webkitRequestAnimationFrame
||
window
.
mozRequestAnimationFrame
||
window
.
oRequestAnimationFrame
||
window
.
msRequestAnimationFrame
||
function
function
(
callback
){
window
.
setTimeout
(
callback
,
1000
/
60
);
};
})();
(
function
function
animloop
(){
requestAnimFrame
(
animloop
);
render
();
})();
(
code originally developed by Paul Irish
)
However,because this method ischanging andhasnotbeen implemented across all browsers,weare
going to use
window.setTimeout()
for applications in this topic.
