ESS added, compatible with ie10 and above
Syntax format: requestID = window.requestAnimationFrame(callback);
Function: Very similar to setTimeout, this function will run about 60 times per second, and the specific system will be reasonably scheduled according to the busy and busy situation to make the animation feel smoother.
Return value: requestID is a long non-zero value used as a unique identifier.
Case:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
#progress{
width: 5px;
height: 10px;
background: #008000;
}
</style>
</head>
<body>
<div id="progress"></div>
<script>
var box = document.getElementById("progress");
box.style.width = "100px";
var i = 0;
var timer = 0;
// timer recursive function
function F(){
i+=5;
box.style.width = i+"px";
if(i<800){
timer = requestAnimationFrame(F);
}
}
requestAnimationFrame(F,50);
</script>
</body>