Forums Développement Multimédia

Aller au contenu

Exercice 08 - Cascade en javascript

TUTO javscript html5 jeux

4 réponses à ce sujet

#1 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 6997 messages

Posté 26 October 2015 - 17:17 PM

Bonjour tout le monde :)

C'est parti pour le huitième exercice, cette fois c'est le CASCADE et on met en avant la récursivité.

Fichier joint  cascade.jpg   37.39 Ko   3 téléchargement(s)

Le tuto Javascript : http://forums.mediab...xercice_cascade
Le tuto Actionscript : http://forums.mediab...rcice_-_cascade

Bonne lecture et comme d'hab, n'hésitez pas à me faire part de vos remarques, questions, conseils,...

#2 dchristov

    Ceinture Blanche

  • Members
  • Pip
  • 14 messages

Posté 05 March 2018 - 20:23 PM

bonjour,je sais que ce poste date un peux mes je tante ma chance
intéressent fortement au développement des jeux
je suis tomber sur c'est quelque tuto fort intéressant mes voila
en adaptant ou essayant d'adapter le jeux a mes envie je me suis apercu d'un truc un peux bizarre
et je comprend pas de ou cela pourrait venir en effet ci je scroll la page ou ce trouve le canvas ben le jeu ce block
ci tu avais une idée elle serait la bienvenu

cordialement

#3 dchristov

    Ceinture Blanche

  • Members
  • Pip
  • 14 messages

Posté 06 March 2018 - 08:48 AM

bonjour
je me permet de remonté car peux être que mon explication n'est pas très claire donc j'ai uploadé une démo pour que vous puissiez vous rendre compte par vous même
la demo
http://pandaokdo.clu...ascade/jeu.html

ci tu ne scroll pas tu clic sur jouer ça va marche mes des que tu va scrollé pour remonté le jeux impossible de cliker
et ci tu revient en position normal tu peux de nouveau clic

Merci par avance

#4 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 6997 messages

Posté 06 March 2018 - 10:07 AM

Bonjour,

Lorsque tu cliques sur le Canvas c'est cette fonction qui est exécutée :

// cliquer sur une case
function jouer(e){
        decouvre(parseInt((e.clientX-posX)/T)+parseInt((e.clientY-posY)/T)*C);
}
 

Quand tu scroll la page le Canvas n'est plus au même endroit par rapport à la zone visible, il faut donc compenser en prenant en compte la position du scroll.

Vérifies les valeurs avec la console du navigateur.
function jouer(e){
        console.log(e);
        console.log(e.clientY);
        console.log(posY);
        console.log(canvas.offsetTop);
        console.log(window.scrollY);
        decouvre(parseInt((e.clientX-posX)/T)+parseInt((e.clientY-posY)/T)*C);
}

Pour corriger ton problème, tu dois donc prendre en compte la position du scroll de la fenêtre quand on clique :

// cliquer sur une case
function jouer(e){
        decouvre(parseInt((e.clientX-posX)/T)+parseInt((e.clientY-posY+window.scrollY)/T)*C);
}


#5 dchristov

    Ceinture Blanche

  • Members
  • Pip
  • 14 messages

Posté 06 March 2018 - 13:06 PM

bonjour,
merci bien pour l'explication on ne peux plus clair



1 utilisateur(s) li(sen)t ce sujet

0 membre(s), 1 invité(s), 0 utilisateur(s) anonyme(s)

authorised training centre

Centre de Formation Mediabox - Adobe et Apple Authorised Training Center.

Déclaré auprès de la Direction du Travail et de la Formation Professionnelle

Mediabox : SARL au capital de 62.000€ - Numéro d'activité : 11 75 44555 75 - SIRET : 49371646800035

MEDIABOX, 23, rue de Bruxelles, 75009 PARIS

FFP