Bonjour, bonsoir,
Étant un grand débutant en JavaScript (j'ai commencé cette après-midi)
Je suis déjà coincé x)
Je vous explique, préférant faire des tests avec ce qui me plait plutôt que de suivre des tutoriels, j'ai commencé à vouloir faire un petit jeu ou l'on incarnerais un petit personnage qui se baladerais et qui tirerais des fleurs qui se posereais sur une map vierge de base. Euh... Ca doit être très clair... Mais en gros on incarne un fleuriste
Donc j'essaye pour commencer de faire une animation de marche.
Donc j'ai chopé un sprite d'un petit personnage (rien d’exceptionnelle) pour ce qui connaisse RPG maker.
Donc le truc c'est qu'il est en 3 temps, un position avec la jambe gauche devant (1), une sans jambe devant (2), et une troisième avec la jambe droite devant (3).
Donc voulant faire les choses bien, mon animation vas être en quatre temps: 2, 1, 2 , 3.
Voilà mon code html:
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5 <article> <h1>Animation avec le javascript</h1> <script type="text/javascript" src="animationtest1.js"></script> <img src="images/couche_transparent.png" id="joueur" onload="animationJoueur()"> </article>
Et voilà mon code Javascript
Alors pour tout vous dire, ça marche pas
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
35
36
37
38
39
40
41 function animationJoueur() { var joueur = document.getElementById("joueur"); joueur.style.background = "url(images/perso001.png) 64px 128px"; joueur.style.width = "32px"; joueur.style.height = "32px"; var marcheAnimJoueur1 = joueur.style.backgroundPosition = "32px 128px"; var marcheAnimJoueur2 = joueur.style.backgroundPosition = "64px 128px"; var marcheAnimJoueur3 = joueur.style.backgroundPosition = "96px 128px"; var timer; var tempsMarche = 1; function animationJoueurMarche() { if(tempsMarche == 1) { joueur = marcheAnimJoueur2; tempsMarche = 2; return; } if(tempsMarche == 2) { joueur = marcheAnimJoueur1; tempsMarche = 3; return; } if(tempsMarche == 3) { joueur = marcheAnimJoueur2; tempsMarche = 4; return; } if(tempsMarche == 4) { joueur = marcheAnimJoueur3; tempsMarche = 1; return; } return; } timer = setInterval(animationJoueurMarche,150); }![]()
En écrivant ses lignes, je pense avoir trouvé la solution oO'
Faudrait-il pas séparer le:
et le mettre complètement hors du code??
Code : Sélectionner tout - Visualiser dans une fenêtre à part timer = setInterval(animationJoueurMarche,150);
... FAUX !
Bon j'ai encore besoin de votre aide alors ^^
Merci d'avance
Edit:
Essayant de trouver d'où vient le problème, j'ai mis:
ici ->
Code : Sélectionner tout - Visualiser dans une fenêtre à part alert("Bouh!");
Soit sur le premier 'if' de mon animation...
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7 if(tempsMarche == 1) { joueur = marcheAnimJoueur2; tempsMarche = 2; alert("bouh!"); return; }
Et là surprise, je me met l' "alert" en boucle !
J'en conclu que c'est bien:
qui me pose problème... What?
Code : Sélectionner tout - Visualiser dans une fenêtre à part timer = setInterval(animationJoueurMarche,150);
Reprendrait-il tout mon script depuis le début?? Pourtant je lui demande juste la fonction : animationJoueurMarche
Code : Sélectionner tout - Visualiser dans une fenêtre à part tempsMarche = 2;
J'dois vous avouez que je suis un peu perdu x)
En faite il fait pire que ça, j'en ai mis un dans le deuxième 'if' il s'affiche en boucle après le premier "bouh !"
J'vais essayer d’emboiter mes "if" pour voir si ça change quelque chose.
Met c'est bizarre vue que j'ai un "return"...
Partager