2014-07-10 15 views
8

Sto creando il cilindro oggetto Canvas (I am new to this Canvas) funziona perfettamente Chrome & Firefox ma quando apro lo stesso file in ie9.Errore requestAnimationFrame in ie9 qualsiasi soluzione alternativa

sto ottenendo errore come 'requestAnimationFrame' è definito

Quando ho google l'errore si dice requestAniationFrame non funziona su IE9.

Qualunque organismo può aiutarmi in questo modo, abbiamo un modo alternativo per risolvere questo problema.

e qui è il mio codice

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++); 
} 

Gentilmente mi aiuti per la soluzione di cui sopra

Grazie riguarda Maha

+1

https://gist.github.com/paulirish/1579671 – adeneo

+0

Non hai davvero cercarlo, vero ?! –

+0

hi @ A.Wolff ho cercato ma non sono riuscito a trovare la soluzione – user3820621

risposta

20

Erik Möller ha sviluppato un polyfill robusto che Paul Irish oggi ospita nella sua blog post about requestAnimationFrame. Se si utilizza questo codice, è possibile utilizzare requestAnimationFrame in quasi tutti i browser in modo trasparente:

(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); 
     }; 
}()); 
+0

grazie @ user1449556 funzionava bene – user3820621

+0

Prego;) – user1449556

+0

Il problema risolto Ho inserito il javascript precedente prima che il mio codice funzionasse correttamente ie9 grazie ancora per tutto – user3820621

Problemi correlati