Bonjour tout le monde !
Voila, je suis en train de m'amuser avec l'�l�ment canvas d'HTML 5, et je cherche a afficher un sprite (petit personnage qui court, 2 positions).
Tout fonctionne, sauf que je sens firefox "planter doucement"
Passer d'un onglet � un autre, ou encore me balader dans les menus de Firefox devient lourd.
J'en conclu que j'ai fait une coquille dans mon javascript (en d�sactivant l'effet de sprite, tout rentre dans l'ordre).
Voila comment je procede :
Dans ma fonction d'initialisation (lanc�e par le onload() de body), je charge mes images de la sorte :
Ensuite vient l'affichage :
Code : S�lectionner tout - Visualiser dans une fen�tre � part
1
2
3
4
5
6
7
8
9
10 var ImgHero = new Image(); // variable globale function InitJS() { ImgHero.src = "Images/Gugus01_sprite.png"; ImgHero.onload = function() { }; }
Le contenu de mon Canvas est redessin� toutes les 50 millisecondes.
Code : S�lectionner tout - Visualiser dans une fen�tre � part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34 this.Draw = function() { switch(ImgSprite) { case 0 : { Context.drawImage(Img,0,0,80,171,x,y,80,171); break; } case 1 : { Context.drawImage(Img,80,0,80,171,x,y,80,171); break; } } this.CalcSprite(); } this.CalcSprite = function() { if(MonTimer>1) { if(ImgSprite == 0) ImgSprite = 1; else ImgSprite = 0; MonTimer = 0; } MonTimer = MonTimer + 0.25; }
A chaque actualisation de mon Canvas, j'incr�mente la valeur MonTimer, qui permet de faire varier p�riodiquement la portion de mon image � afficher (pour avoir cet effet de bonhomme qui court).
Ca fonctionne, mais ce n'est certainement pas tr�s propre, et j'imagine que c'est pour �a que mon navigateur plantouille.
Une id�e pour rendre la chose moins lourde?
Merci![]()
Partager