Error requestAnimationFrame in ie9 any alternate solution

canvas, html5-canvas, internet-explorer-9, javascript, jquery

Solution

Erik Möller developed a robust polyfill that Paul Irish now hosts in his blog post about requestAnimationFrame. If you use this code, you can use requestAnimationFrame in pretty much any browser transparently:

(function() {
    var lastTime = 0;
    var vendors = ['webkit', 'moz'];
    for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
        window.requestAnimationFrame = window[vendors[x]+'RequestAnimationFrame'];
        window.cancelAnimationFrame =
          window[vendors[x]+'CancelAnimationFrame'] || window[vendors[x]+'CancelRequestAnimationFrame'];
    }

    if (!window.requestAnimationFrame)
        window.requestAnimationFrame = function(callback, element) {
            var currTime = new Date().getTime();
            var timeToCall = Math.max(0, 16 - (currTime - lastTime));
            var id = window.setTimeout(function() { callback(currTime + timeToCall); },
              timeToCall);
            lastTime = currTime + timeToCall;
            return id;
        };

    if (!window.cancelAnimationFrame)
        window.cancelAnimationFrame = function(id) {
            clearTimeout(id);
        };
}());

Problem

I am creating Canvas (I am new to this Canvas) object cylinder this is working fine Chrome & Firefox but when i open the same file in ie9. I am getting error as 'requestAnimationFrame' is undefined When i google the error it says requestAniationFrame won't work on ie9. Can any body help me with this do we have any alternate way to solve this. and here is my code ``` var canvas = document.getElementById("canvas"); var context = canvas.getContext("2d"); var degreeAngle = 0; requestAnimationFrame(animate); function drawRotatedCylinder(x, y, w, h, degreeAngle) { context.save(); context.translate(x + w / 10, y + h / 10); context.rotate(degreeAngle * Math.PI / 180); drawCylinder(-w / 10, -h / 10, w, h); context.restore(); } function animate() { //requestAnimationFrame(animate); context.clearRect(0, 0, canvas.width, canvas.height); drawRotatedCylinder(100, 100, 180, 180, degreeAngle++); } ``` Kindly help me for the above solution Thanks Regards Maha

Original source