Un cas intéressant où IE fonctionne réellement comme je le souhaite :-) J'ai fait cette fonction pour faire des animations SVG via requestAnimationFrame (pour cet exemple j'ai omis les calculs de valeur, etc ... mais ma première expérience était d'animer un changement de l'attribut 'fill' d'un rect SVG). Quoi qu'il en soit, IE exécute l'animation de manière agréable et rapide ... mais tous les autres navigateurs ont un délai notable avant de lancer l'animation. Presque comme ces navigateurs ont besoin de "tourner" un moteur pour gérer cela à chaque fois ... j'ai aussi regardé d'autres exemples en ligne et certaines des animations semblaient "saccadées". Je suppose que je pourrais utiliser requestAnimationFrame pour IE et CSS3 images clés pour les autres navigateurs :-(ne veulent pas vraiment. Est-ce que je manque quelque chose? Pourquoi le retard avant que l'animation joueRetard indésirable avant requestAnimationFrame?
?animateViaRequestAnimationFrame = function() { //
var duration = arguments[0].duration;
// requestAnimationFrame is ~60 frames/second
var quantityFrameCalls = parseInt((duration/1000)*60);
i = 1;
function callFrame(){
// here, bunch of values math and updating the target element properties
i++;
if (i < quantityFrameCalls+1) {
requestAnimationFrame(function(){
callFrame();
});
} // if
} // callFrame
requestAnimationFrame(function(){
callFrame();
});
}; // animateViaRequestAnimationFrame
Oups, merci Ben, ouais le début de la fonction callFrame aiderait, n'est-ce pas :-) J'ai quelques boucles pour convertir des valeurs hexadécimales mais je ne pense pas que ce soit le ralentissement car elles consomment instantanément. puis l'animation joue après un délai. Je suppose que je me demande juste s'il y a un peu de magie pour travailler avec requestAnimationFrame dans les navigateurs autres que IE –
Juste un conseil très simple, quand vous faites 'requestAnimationFrame (function() {callFrame();});' faire 'requestAnimationFrame (callFrame);' –
Merci Patrick oui j'ai essayé aussi. –