|
 Trouver une ressource
Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum. Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !
 LABYRINTHE FACILE À UTILISER ET À MODIFIER
 Information sur la source
 Description
Comme le titre le dit c'est un labyrinthe dans lequel on peut se déplacer à l'aide des flèches situées sur le côté (2,4,6,8) ou pour les navigateurs qui ne supportent pas le event.keyCode il y a des boutons dans le bas du script pour se déplacer. Aussi j'ai intégré dans le zip un générateur de labyrinthe qui est aussi facile à utiliser.
 Source
- <HTML>
- <HEAD>
- <TITLE>..: Labyrinthe :..</TITLE>
- <SCRIPT language="javascript">
- positionFin = "19,24"
- window.status = "Chargement de la page"
- function départ()
- {
- window.status = "Création des murs"
- créemur()
- window.status = "Initiation de la case de départ"
- document.getElementById("0,0").style.backgroundColor = "C80000"
- document.getElementById("f0,0").color="C80000"
- document.form.positionX.value = 0
- document.form.positionY.value = 0
- window.status = "Initiation de la case de la fin"
- document.getElementById(positionFin).style.backgroundColor = "0AC814"
- document.getElementById("f"+positionFin).color = "0AC814"
- window.status = ""
- }
- function move(e)
- {
- y = document.form.positionY.value*1
- x = document.form.positionX.value*1
- if (e == 50 && check(y+1,x))
- {
- afficher(y+1,x)
- }
- if (e == 54 && check(y,x+1))
- {
- afficher(y,x+1)
- }
- if (e == 56 && check(y-1,x))
- {
- afficher(y-1,x)
- }
- if (e == 52 && check(y,x-1))
- {
- afficher(y,x-1)
- }
- }
- function check(Y,X)
- {
- if (document.getElementById(Y+","+X)) return true
- else return false
- }
- function afficher(Y,X)
- {
- effacer(document.form.positionY.value,document.form.positionX.value)
- document.getElementById(Y+","+X).style.backgroundColor = "C80000"
- document.getElementById("f"+Y+","+X).color="C80000"
- document.form.positionX.value = X
- document.form.positionY.value = Y
- vérifier()
- }
- function effacer(Y,X)
- {
- document.getElementById(Y+","+X).style.backgroundColor = "FFFFFF"
- document.getElementById("f"+Y+","+X).color = "FFFFFF"
- }
- function créemur()
- {
- position = new Array("1,1","2,2","0,1","2,1","4,0","4,2","5,2","4,3","2,3","2,4","6,2","6,1","8,1","8,2","8,3","8,4","7,4","6,4","2,6","3,6","4,6","5,6","6,6","7,6","4,5","6,7","8,5","8,6","0,3","0,4","0,5","0,6","0,7","0,8","1,8","2,8","3,8","4,8","6,9","7,9","8,9","8,8","9,8","4,9","4,10","4,11","5,11","6,11","6,0","9,3","10,3","10,4","10,5","10,6","11,6","11,7","11,8","11,9","11,10","10,10","10,11","9,11","8,11","10,0","10,1","11,1","12,1","12,3","12,4","13,4","13,5","14,1","14,2","14,3","14,4","15,2","16,0","16,1","16,2","13,7","13,8","13,9","13,10","13,11","13,12","12,12","14,7","15,7","15,6","16,6","16,5","16,4","18,1","18,2","18,3","18,4","18,5","18,6","19,4","4,13","5,13","6,13","7,13","8,13","9,13","10,13","19,8","18,8","17,8","17,9","16,9","15,9","17,10","18,10","18,11","18,12","18,13","17,13","16,13","16,12","15,12","15,11","13,13","14,14","13,14","10,14","11,14","1,10","2,10","2,11","2,12","2,13","3,13","0,12","0,14","0,15","1,15","11,15","11,16","12,16","13,16","15,16","16,16","16,15","17,15","18,15","19,15","19,17","18,17","18,18","17,18","16,18","15,18","14,18","13,18","12,18","11,18","10,18","9,18","9,17","9,16","8,16","8,15","7,15","6,15","5,15","5,14","2,15","3,15","3,16","3,17","4,17","5,17","6,17","6,18","7,18","3,19","4,19","4,20","5,20","6,20","7,20","8,20","9,20","10,20","11,20","12,20","10,21","10,22","11,22","12,22","13,22","14,22","14,21","14,20","15,20","16,20","17,20","18,20","17,21","17,22","18,22","19,22","15,22","1,17","1,18","1,19","1,20","1,21","1,23","0,23","2,21","2,22","2,23","3,22","5,22","5,23","5,24","7,21","7,22","7,23","9,22","10,24","12,23","14,24","16,24","15,22","18,23")
- pos = position
- for (i=0;i<position.length;i++)
- {
- pos[i] = pos[i].split(",")
- if (check(pos[i][0],pos[i][1]))
- {
- document.getElementById(position[i]).style.backgroundColor = "000000"
- document.getElementById("f"+position[i]).color = "000000"
- document.getElementById(position[i]).id = ""
- }
- }
- }
- function vérifier()
- {
- if (document.form.positionY.value+","+document.form.positionX.value == positionFin)
- {
- alert("Vous avez gagné !")
- }
- }
- </SCRIPT>
- </HEAD>
- <BODY onload="départ()" onkeypress="move(event.keyCode)">
- <FORM name="form">
- <INPUT type="hidden" name="hauteur">
- <INPUT type="hidden" name="largeur">
- <INPUT type="hidden" name="positionX">
- <INPUT type="hidden" name="positionY">
- </FORM>
- <SCRIPT>
- window.status = "Chargement du labyrinthe"
- hauteur = 20
- largeur = 25
- backgcolor = "FFFFFF"
- code ="<TABLE border='0'><TR>"
- for (i=0;i<largeur+2;i++)
- {
- code+="<TD bgcolor='000000'></TD>"
- }
- code+="</TR>"
- for (i=0;i<hauteur;i++)
- {
- code +="<TR><TD bgcolor='000000'></TD>"
- for (x=0;x<largeur;x++)
- {
- code += "<TD id='"+i+","+x+"' bgcolor='"+backgcolor+"'><FONT color='"+backgcolor+"' id='f"+i+","+x+"'>---</FONT></TD>"
- }
- code+="<TD bgcolor='000000'></TD></TR>"
- }
- code+="<TR>"
- for (i=0;i<largeur+2;i++)
- {
- code+="<TD bgcolor='000000'></TD>"
- }
- code+="</TR>"
- code+="</TABLE>"
- document.write(code)
- document.form.hauteur.value = hauteur
- document.form.largeur.value = largeur
- </SCRIPT>
- <FORM> <INPUT type="button" value="Haut" onclick="move(56)"><BR><INPUT type="button" value="Gauche" onclick="move(52)"><INPUT type="button" value="Droite" onclick="move(54)"><BR> <INPUT type="button" value="Bas" onclick="move(50)"></FORM>
- Vous devez vous rendre à la case verte.
- </BODY>
- </HTML>
<HTML>
<HEAD>
<TITLE>..: Labyrinthe :..</TITLE>
<SCRIPT language="javascript">
positionFin = "19,24"
window.status = "Chargement de la page"
function départ()
{
window.status = "Création des murs"
créemur()
window.status = "Initiation de la case de départ"
document.getElementById("0,0").style.backgroundColor = "C80000"
document.getElementById("f0,0").color="C80000"
document.form.positionX.value = 0
document.form.positionY.value = 0
window.status = "Initiation de la case de la fin"
document.getElementById(positionFin).style.backgroundColor = "0AC814"
document.getElementById("f"+positionFin).color = "0AC814"
window.status = ""
}
function move(e)
{
y = document.form.positionY.value*1
x = document.form.positionX.value*1
if (e == 50 && check(y+1,x))
{
afficher(y+1,x)
}
if (e == 54 && check(y,x+1))
{
afficher(y,x+1)
}
if (e == 56 && check(y-1,x))
{
afficher(y-1,x)
}
if (e == 52 && check(y,x-1))
{
afficher(y,x-1)
}
}
function check(Y,X)
{
if (document.getElementById(Y+","+X)) return true
else return false
}
function afficher(Y,X)
{
effacer(document.form.positionY.value,document.form.positionX.value)
document.getElementById(Y+","+X).style.backgroundColor = "C80000"
document.getElementById("f"+Y+","+X).color="C80000"
document.form.positionX.value = X
document.form.positionY.value = Y
vérifier()
}
function effacer(Y,X)
{
document.getElementById(Y+","+X).style.backgroundColor = "FFFFFF"
document.getElementById("f"+Y+","+X).color = "FFFFFF"
}
function créemur()
{
position = new Array("1,1","2,2","0,1","2,1","4,0","4,2","5,2","4,3","2,3","2,4","6,2","6,1","8,1","8,2","8,3","8,4","7,4","6,4","2,6","3,6","4,6","5,6","6,6","7,6","4,5","6,7","8,5","8,6","0,3","0,4","0,5","0,6","0,7","0,8","1,8","2,8","3,8","4,8","6,9","7,9","8,9","8,8","9,8","4,9","4,10","4,11","5,11","6,11","6,0","9,3","10,3","10,4","10,5","10,6","11,6","11,7","11,8","11,9","11,10","10,10","10,11","9,11","8,11","10,0","10,1","11,1","12,1","12,3","12,4","13,4","13,5","14,1","14,2","14,3","14,4","15,2","16,0","16,1","16,2","13,7","13,8","13,9","13,10","13,11","13,12","12,12","14,7","15,7","15,6","16,6","16,5","16,4","18,1","18,2","18,3","18,4","18,5","18,6","19,4","4,13","5,13","6,13","7,13","8,13","9,13","10,13","19,8","18,8","17,8","17,9","16,9","15,9","17,10","18,10","18,11","18,12","18,13","17,13","16,13","16,12","15,12","15,11","13,13","14,14","13,14","10,14","11,14","1,10","2,10","2,11","2,12","2,13","3,13","0,12","0,14","0,15","1,15","11,15","11,16","12,16","13,16","15,16","16,16","16,15","17,15","18,15","19,15","19,17","18,17","18,18","17,18","16,18","15,18","14,18","13,18","12,18","11,18","10,18","9,18","9,17","9,16","8,16","8,15","7,15","6,15","5,15","5,14","2,15","3,15","3,16","3,17","4,17","5,17","6,17","6,18","7,18","3,19","4,19","4,20","5,20","6,20","7,20","8,20","9,20","10,20","11,20","12,20","10,21","10,22","11,22","12,22","13,22","14,22","14,21","14,20","15,20","16,20","17,20","18,20","17,21","17,22","18,22","19,22","15,22","1,17","1,18","1,19","1,20","1,21","1,23","0,23","2,21","2,22","2,23","3,22","5,22","5,23","5,24","7,21","7,22","7,23","9,22","10,24","12,23","14,24","16,24","15,22","18,23")
pos = position
for (i=0;i<position.length;i++)
{
pos[i] = pos[i].split(",")
if (check(pos[i][0],pos[i][1]))
{
document.getElementById(position[i]).style.backgroundColor = "000000"
document.getElementById("f"+position[i]).color = "000000"
document.getElementById(position[i]).id = ""
}
}
}
function vérifier()
{
if (document.form.positionY.value+","+document.form.positionX.value == positionFin)
{
alert("Vous avez gagné !")
}
}
</SCRIPT>
</HEAD>
<BODY onload="départ()" onkeypress="move(event.keyCode)">
<FORM name="form">
<INPUT type="hidden" name="hauteur">
<INPUT type="hidden" name="largeur">
<INPUT type="hidden" name="positionX">
<INPUT type="hidden" name="positionY">
</FORM>
<SCRIPT>
window.status = "Chargement du labyrinthe"
hauteur = 20
largeur = 25
backgcolor = "FFFFFF"
code ="<TABLE border='0'><TR>"
for (i=0;i<largeur+2;i++)
{
code+="<TD bgcolor='000000'></TD>"
}
code+="</TR>"
for (i=0;i<hauteur;i++)
{
code +="<TR><TD bgcolor='000000'></TD>"
for (x=0;x<largeur;x++)
{
code += "<TD id='"+i+","+x+"' bgcolor='"+backgcolor+"'><FONT color='"+backgcolor+"' id='f"+i+","+x+"'>---</FONT></TD>"
}
code+="<TD bgcolor='000000'></TD></TR>"
}
code+="<TR>"
for (i=0;i<largeur+2;i++)
{
code+="<TD bgcolor='000000'></TD>"
}
code+="</TR>"
code+="</TABLE>"
document.write(code)
document.form.hauteur.value = hauteur
document.form.largeur.value = largeur
</SCRIPT>
<FORM> <INPUT type="button" value="Haut" onclick="move(56)"><BR><INPUT type="button" value="Gauche" onclick="move(52)"><INPUT type="button" value="Droite" onclick="move(54)"><BR> <INPUT type="button" value="Bas" onclick="move(50)"></FORM>
Vous devez vous rendre à la case verte.
</BODY>
</HTML>
 Conclusion
Voici le principe de mon script : - Premièrment il crée un tableau vide avec les dimensions voulues. - Deuxièment il crée les murs ( enlève le id des cases et les mets de couleur ) - Troisièment lorsque l'on se déplace si il ne trouve pas l'object vers lequel il se déplace il ne bouge pas, donc si on a enlevé le id où il y a des murs il ne peut pas se déplacer sur le mur. Testé sur : - Internet Explorer - Modzilla - Netscape - Firefox - Opéra
 Historique
- 30 mars 2005 16:50:21 :
- Petit problème de position dans le générateur.
- 30 mars 2005 19:09:09 :
- Ajout d'un générateur aléatoire dans le zip.
- 31 mars 2005 02:48:19 :
- Le générateur de labyrinthe aléatoire fonctionne mieux.
- 31 mars 2005 19:10:56 :
- Le générateur aléatoire est enfin finaliser et presque parfait.
- 31 mars 2005 21:03:23 :
- Petite correction
- 28 novembre 2005 00:59:01 :
- Ajout de mot clé
 Sources du même auteur
 Sources de la même categorie
Sources en rapport avec celle ci
 Commentaires et avis
 Discussions en rapport avec ce code source dans le forum
Jeux dhtml javascript [ par Cyreb ]
Voila, je regarde depuis longtemps les sources proposé sur ce site et je m'interesse aux jeux en javascripts, pourquoi ne pas créer de veritable proje
Générateur dynamique de formulaire Ajax [ par plefebv ]
Bonjour ,C'est peut-être une FAQ tant le sujet me semble évident, mais j'ai dû passer à côté. Dans ce cas, merci de me faire savoir où trouver la doc
Livre javascript pour débutant [ par PatMh ]
Salut,Bon je ne vais pas être très original ...Je recherche un bon livre pour débutant afin d'apprendre rapidement javascript, svp.C'est en relation a
javascript pour ie6 - impression [ par buckdany4 ]
Bonjour à tous,Comment rendre l'impression impossible avec ie6 , donc mettre le choix impression invisible, inactif, ou autre.. <p class="MsoNorm
Javascript et includes PHP [ par med76 ]
Bonjour,J'aimerais savoir si on peut accéder à des éléments d'une page inclue en PHP (avec la fonction include()) avec du javascript.Je pose la questi
Executer la fonction situer dans le onblur d'un input [ par Erick007 ]
Bonjour,J'ai un petit problème que je ne sais pas si cela se fait. Je vous explique en premier ce que je veut faire, je me fais une fonction javascrip
Problème d'encodage HTML et Javascript [ par demorex6 ]
Salut à tous! Je suis en train de realiser une petite application multilingue en php-Javascript-Mysql. J'ai créé un fichier pour la langue française
Dynamiser une page web via l'url par javascript ? [ par Thommen ]
Bonjour à tous, Je cherche comme une folle, mais sans succès, à dynamiser une page web sans avoir à créer une base de donnée. Je m'explique: sur le
Ordonner un table SQL avec Javascript [ par saltwater08 ]
Bonjour, ma question est la suivante: J'ai un affichage d'une table en sql dans un table je veux que lorsque je clique sur un des titres de la tabl
probleme javascript [ par gaucyril ]
Bonjour,J'ai un petit probleme :J'essaye de faire une verification d'extension de fichier avant upload mais cela ne fonctionne pas. Je vous transmets
|
 Téléchargements
Logiciels à télécharger sur le même thème :
|