Skip to content

Instantly share code, notes, and snippets.

@ruanyl

ruanyl/requestAnimFrame.html

Created March 30, 2014 15:44
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ruanyl/9874657 to your computer and use it in GitHub Desktop.
Save ruanyl/9874657 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
requestAnimFrame.html
<!DOCTYPE HTML>
<html>
<head>
<style>
body {
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<canvas id="myCanvas" width="578" height="200"></canvas>
<script>
window.requestAnimFrame = (function(callback) {
return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame ||
function(callback) {
window.setTimeout(callback, 1000 / 60);
};
})();
function animate() {
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');
// update
// clear
context.clearRect(0, 0, canvas.width, canvas.height);
// draw stuff
// request new frame
requestAnimFrame(function() {
animate();
});
}
animate();
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment