|
 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 !
 JEUX MEMORY
 Information sur la source
 Description
Un petit jeux de memory en javascript pour amuser vos visiteurs. Se jeux est limité à 8 cartes mais peut-être étendu à un nombre de cartes plus élevé.
 Source
- <html>
-
-
- <style>
-
- .cartes, .Back, .Front, .Perdu{
- background-repeat: no-repeat;
- background-position: center center;
- border: 0px solid gray;
- cursor: pointer;
-
- /* La Largeur d'une Image */
- width: 118px;
-
- /* La Hauteur d'une Image */
- height: 186px;
- }
-
- .Back {
- z-index : 10;
- background-image: url(Back.jpg);
- }
-
- </style>
-
- <SCRIPT language="JavaScript" type="text/JavaScript">
-
- var Gagner = 0;
- var Count = 0;
- var LastCarte = null;
- var ModeDebug = false;
-
- // 4 valeurs * 2 = 8 Cartes, 5 valeurs * 2 = 10 Cartes etc...
- var ArrayCartes = new Array("A", "B", "C", "D");
- var ValueCarte = ArrayCartes.concat(ArrayCartes);
- var NbrValeur = ValueCarte.length;
- var ArrayDonne = new Array(NbrValeur);
- var Tirage = true;
- var Tentative = 0;
- var PairesOk = 0;
-
- // Temporisateur en secondes
- var Tempor = 1000;
-
- // Retourne toutes les Cartes (Coté Back)
- function InitCarte()
- {
- objColTr = document.getElementById('TabCarte').rows;
-
- for(i=0; i < objColTr.length; i++)
- {
- colTd = objColTr[i].cells
- for(x=0; x < colTd.length; x++)
- {
- colTd[x].style.backgroundImage = "";
- colTd[x].className = "Back";
- }
- }
- Count = 0;
- document.getElementById('Rejouer').disabled = true;
- Donne();
- }
-
- // Tirage Aléatoire des Cartes
- function Donne()
- {
- var objMSG = document.getElementById("MSG");
- var objColTr = document.getElementById('TabCarte').rows;
- var NbrCartes = (objColTr[0].cells.length * objColTr.length);
- var objDebug = document.getElementById("DivDebug");
-
- var OK = true;
- var Buffer = "";
- var Compteur = 0;
-
- // Affiche Masque les infos de debuguage
- objDebug.style.display = (ModeDebug) ? "block" : "none";
-
- // Le Nbr de Cartes(TD) doit etre egale au Nbr de Valeurs
- // Et doit être un Nbr Paire
- if(NbrValeur == NbrCartes)
- {
- while(OK)
- {
- var Tirage = Math.floor(Math.random() * NbrCartes);
- var reg = new RegExp("#"+Tirage+":", "gi") ;
-
- if (!reg.test(Buffer))
- {
- ArrayDonne[Compteur] = ValueCarte[Tirage];
- Buffer += "#" + Tirage+ ":";
-
- // Affiche le Buffer pour Debug Infos
- objMSG.innerHTML = Buffer;
- Compteur ++;
- if(Compteur == NbrCartes) OK = false;
- }
- }
- }
- }
-
- // Temporisateur Reset
- function ResetChoix(objID, objLast)
- {
- objID = document.getElementById(objID);
- objLast = document.getElementById(objLast);
-
- // Images Vide
- objID.style.backgroundImage = "";
- objLast.style.backgroundImage = "";
-
- // Classe Back
- objID.className = "Back";
- objLast.className = "Back";
- Tirage = true;
- }
-
- // Click sur une Carte
- function Jouer(objID)
- {
- // La Carte ne doit pas être retournée
- if(Tirage && objID.className != "Front")
- {
- Tirage = false;
-
- if(LastCarte == null)
- {
- objID.className = "Front";
- objID.style.backgroundImage = "url("+ArrayDonne[objID.id]+".jpg)";
- LastCarte = objID;
- Tirage = true;
- }
- else
- {
- if(LastCarte.id != objID.id && objID.className != "Front")
- {
- // Retourne la Carte et Affiche sa Valeur/Image
- objID.className = "Front";
- objID.style.backgroundImage = "url("+ArrayDonne[objID.id]+".jpg)";
-
- // Si les deux Cartes sont DIFFÉRENTE
- if(ArrayDonne[objID.id] != ArrayDonne[LastCarte.id])
- {
- // Declenche le Temporisateur
- a = setTimeout( "ResetChoix(" + objID.id + ", "+ LastCarte.id + ")", Tempor);
- LastCarte = null;
- }
- else
- {
- // Les Deux Cartes sont EGALE
- LastCarte = null;
- Count ++;
- PairesOk ++;
- document.getElementById('paires').innerHTML = PairesOk;
-
- // Si Tout Gagner (nbr de paires)
- if(Count == (NbrValeur/2))
- {
- Gagner ++;
- document.getElementById('NbrGagner').innerHTML = Gagner;
- document.getElementById('Rejouer').disabled = false;
- }
- Tirage = true;
- }
-
- Tentative ++;
- document.getElementById('Try').innerHTML = Tentative;
-
- }
- }
- }
- }
-
- // 1ere Donne des Cartes
- window.onload = Donne;
- </SCRIPT>
-
-
- <BODY>
-
- <TABLE border=0 width=70% align=center cellspacing="2" cellpadding="2" >
-
- <TR>
- <TD colspan=2>
- <div id="DivDebug" style="display:none;" >
- <table width=100% align=center cellspacing="0" cellpadding="0" border=0 >
- <TR>
- <TD> Nbr Gagner : </TD><TD align=left id="NbrGagner" width=5% > </td>
- <TD> Valeurs Aléatoire: </TD><TD align=left id="MSG"> </td>
- </TR>
- <TR>
- <TD> Tentatives : </TD><TD align=left id="Try"> </td>
- <TD> Paires Ok : </TD><TD align=left id="paires"> </td>
- </TR>
- </table>
- </div>
- </TD>
- </TR>
- <TR>
- <TD>
- <label for="tempo"> Niveaux de Difficulté </label>
- <select id="tempo" onchange="Tempor = this[this.selectedIndex].value;">
- <option value=1500>Facile</option>
- <option value=1000 selected>Moyen</option>
- <option value=500>Dur</option>
- <option value=200>Trés Dur</option>
- </select>
- </TD>
- <TD>
- <input id="Rejouer" type="button" value="Rejouer" onclick="InitCarte();" disabled>
- </TD>
- </TR>
- </TABLE>
- <br>
- <TABLE border=0 align=center cellspacing="1" cellpadding="1" >
-
- <TBODY id=TabCarte>
- <tr>
- <td id="0" onclick="Jouer(this)" class=Back> </td>
- <td id="1" onclick="Jouer(this)" class=Back> </td>
- <td id="2" onclick="Jouer(this)" class=Back> </td>
- <td id="3" onclick="Jouer(this)" class=Back> </td>
- </tr>
- <tr>
- <td id="4" onclick="Jouer(this)" class=Back> </td>
- <td id="5" onclick="Jouer(this)" class=Back> </td>
- <td id="6" onclick="Jouer(this)" class=Back> </td>
- <td id="7" onclick="Jouer(this)" class=Back> </td>
- </tr>
- </TBODY>
-
- </TABLE>
-
- </BODY>
- </HTML>
<html>
<style>
.cartes, .Back, .Front, .Perdu{
background-repeat: no-repeat;
background-position: center center;
border: 0px solid gray;
cursor: pointer;
/* La Largeur d'une Image */
width: 118px;
/* La Hauteur d'une Image */
height: 186px;
}
.Back {
z-index : 10;
background-image: url(Back.jpg);
}
</style>
<SCRIPT language="JavaScript" type="text/JavaScript">
var Gagner = 0;
var Count = 0;
var LastCarte = null;
var ModeDebug = false;
// 4 valeurs * 2 = 8 Cartes, 5 valeurs * 2 = 10 Cartes etc...
var ArrayCartes = new Array("A", "B", "C", "D");
var ValueCarte = ArrayCartes.concat(ArrayCartes);
var NbrValeur = ValueCarte.length;
var ArrayDonne = new Array(NbrValeur);
var Tirage = true;
var Tentative = 0;
var PairesOk = 0;
// Temporisateur en secondes
var Tempor = 1000;
// Retourne toutes les Cartes (Coté Back)
function InitCarte()
{
objColTr = document.getElementById('TabCarte').rows;
for(i=0; i < objColTr.length; i++)
{
colTd = objColTr[i].cells
for(x=0; x < colTd.length; x++)
{
colTd[x].style.backgroundImage = "";
colTd[x].className = "Back";
}
}
Count = 0;
document.getElementById('Rejouer').disabled = true;
Donne();
}
// Tirage Aléatoire des Cartes
function Donne()
{
var objMSG = document.getElementById("MSG");
var objColTr = document.getElementById('TabCarte').rows;
var NbrCartes = (objColTr[0].cells.length * objColTr.length);
var objDebug = document.getElementById("DivDebug");
var OK = true;
var Buffer = "";
var Compteur = 0;
// Affiche Masque les infos de debuguage
objDebug.style.display = (ModeDebug) ? "block" : "none";
// Le Nbr de Cartes(TD) doit etre egale au Nbr de Valeurs
// Et doit être un Nbr Paire
if(NbrValeur == NbrCartes)
{
while(OK)
{
var Tirage = Math.floor(Math.random() * NbrCartes);
var reg = new RegExp("#"+Tirage+":", "gi") ;
if (!reg.test(Buffer))
{
ArrayDonne[Compteur] = ValueCarte[Tirage];
Buffer += "#" + Tirage+ ":";
// Affiche le Buffer pour Debug Infos
objMSG.innerHTML = Buffer;
Compteur ++;
if(Compteur == NbrCartes) OK = false;
}
}
}
}
// Temporisateur Reset
function ResetChoix(objID, objLast)
{
objID = document.getElementById(objID);
objLast = document.getElementById(objLast);
// Images Vide
objID.style.backgroundImage = "";
objLast.style.backgroundImage = "";
// Classe Back
objID.className = "Back";
objLast.className = "Back";
Tirage = true;
}
// Click sur une Carte
function Jouer(objID)
{
// La Carte ne doit pas être retournée
if(Tirage && objID.className != "Front")
{
Tirage = false;
if(LastCarte == null)
{
objID.className = "Front";
objID.style.backgroundImage = "url("+ArrayDonne[objID.id]+".jpg)";
LastCarte = objID;
Tirage = true;
}
else
{
if(LastCarte.id != objID.id && objID.className != "Front")
{
// Retourne la Carte et Affiche sa Valeur/Image
objID.className = "Front";
objID.style.backgroundImage = "url("+ArrayDonne[objID.id]+".jpg)";
// Si les deux Cartes sont DIFFÉRENTE
if(ArrayDonne[objID.id] != ArrayDonne[LastCarte.id])
{
// Declenche le Temporisateur
a = setTimeout( "ResetChoix(" + objID.id + ", "+ LastCarte.id + ")", Tempor);
LastCarte = null;
}
else
{
// Les Deux Cartes sont EGALE
LastCarte = null;
Count ++;
PairesOk ++;
document.getElementById('paires').innerHTML = PairesOk;
// Si Tout Gagner (nbr de paires)
if(Count == (NbrValeur/2))
{
Gagner ++;
document.getElementById('NbrGagner').innerHTML = Gagner;
document.getElementById('Rejouer').disabled = false;
}
Tirage = true;
}
Tentative ++;
document.getElementById('Try').innerHTML = Tentative;
}
}
}
}
// 1ere Donne des Cartes
window.onload = Donne;
</SCRIPT>
<BODY>
<TABLE border=0 width=70% align=center cellspacing="2" cellpadding="2" >
<TR>
<TD colspan=2>
<div id="DivDebug" style="display:none;" >
<table width=100% align=center cellspacing="0" cellpadding="0" border=0 >
<TR>
<TD> Nbr Gagner : </TD><TD align=left id="NbrGagner" width=5% > </td>
<TD> Valeurs Aléatoire: </TD><TD align=left id="MSG"> </td>
</TR>
<TR>
<TD> Tentatives : </TD><TD align=left id="Try"> </td>
<TD> Paires Ok : </TD><TD align=left id="paires"> </td>
</TR>
</table>
</div>
</TD>
</TR>
<TR>
<TD>
<label for="tempo"> Niveaux de Difficulté </label>
<select id="tempo" onchange="Tempor = this[this.selectedIndex].value;">
<option value=1500>Facile</option>
<option value=1000 selected>Moyen</option>
<option value=500>Dur</option>
<option value=200>Trés Dur</option>
</select>
</TD>
<TD>
<input id="Rejouer" type="button" value="Rejouer" onclick="InitCarte();" disabled>
</TD>
</TR>
</TABLE>
<br>
<TABLE border=0 align=center cellspacing="1" cellpadding="1" >
<TBODY id=TabCarte>
<tr>
<td id="0" onclick="Jouer(this)" class=Back> </td>
<td id="1" onclick="Jouer(this)" class=Back> </td>
<td id="2" onclick="Jouer(this)" class=Back> </td>
<td id="3" onclick="Jouer(this)" class=Back> </td>
</tr>
<tr>
<td id="4" onclick="Jouer(this)" class=Back> </td>
<td id="5" onclick="Jouer(this)" class=Back> </td>
<td id="6" onclick="Jouer(this)" class=Back> </td>
<td id="7" onclick="Jouer(this)" class=Back> </td>
</tr>
</TBODY>
</TABLE>
</BODY>
</HTML>
 Historique
- 31 mai 2008 13:41:07 :
- oubli
- 02 juin 2008 15:37:54 :
- Correction pour tirage > à 10 Cartes
L'expression Réguliére ne fonctionne pas
voici la correction
while(OK)
{
var Tirage = Math.floor(Math.random() * NbrCartes)
var reg = new RegExp("#"+Tirage+":", "gi")
if (!reg.test(Buffer))
{
ArrayDonne[Compteur] = ValueCarte[Tirage];
Buffer += "#" + Tirage+ ":";
// Affiche le Buffer pour Debug Infos
objMSG.innerHTML += Tirage +"|";
Compteur ++;
if(Compteur == NbrCartes) OK = false;
}
}
- 02 juin 2008 15:41:26 :
- Pour les Tirage > à 10 Carte l'expression réguliére ne fonctionne pas
Correction function Donne()
- 02 décembre 2008 19:45:46 :
-
Correction du nombre supérieur de cartes à 9
optimisation du code.
- 02 décembre 2008 19:52:04 :
- Optimisation du code.
résolution de l'affichage correct de la class Back
(inutile désormais de supprimer l'image)
ajout de la possibilitée d'afficher ou non le mode debug.
- 02 décembre 2008 21:07:57 :
- Mise à jour du code (optimisation)
ajout possibilité de mettre en mode debug ou non
- 02 décembre 2008 21:15:59 :
- mise a jour du zip
contient les même modification de code.
 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
placer une image à la place d'une fenêtre d'Alerte - Comment modifier mon code javascript svp? [ par RomantikA ]
Bonjour, veuillez m'excuser pour cette question peut être stupide et/ou imprécise, mais je désirerais savoir s'il est possible de modifier un code jav
Récupérer une valeur d' Access via un codage Javascript [ par mareuh ]
Bonjour, je suis novice en progarmmation javascript, et j'ai besoin de dévélopper une application en javascript qui récupère des données dans une base
Quelqu'un d'assez fort en javascript sait il faire ??? [ par AUZUR ]
Bonjour tout le monde, voila je débute en javascript, et je dois développer une fonction pour mon entreprise, qui doit gérer les caractères spéciaux.
Comment manipuler un XML déjà en mémoire via une routine en javascript? [ par zazalamouche ]
Voici quelques info sur mon problème:J'ai un fichier XML qui contient des données et un fichier XSL qui contient le format d'affichageLe XML référence
probleme fonction javascript et validation w3c [ par anthonydb ]
Bonjour à tous voilà je vous expose mon probléme j'ai une fonction javascript qui me permet de mettre a jour des listes liées sans avoir a cliquer sur
Problème alignement [ par overstorex ]
Bonsoir,J'espère que je suis au bonne endroit pour poster cette demande d'aide.je suis un néophyte en script,je m'en excuse .<img src="http://www.java
Perte d'accent après un form.submit en javascript. [ par guitoulefoux ]
<link rel="Fi
Centrer background en JavaScript [ par forget2212 ]
Bonsoir, J'ai un site web qui fonctionne en CSS et je veux introduire du JS pour le bas de la page (copyright) sur toutes mes pages. Mon fichier c
Javascript qui suit le défilement d'une fenêtre [ par moratonga ]
Bonjour,je suis l'animatrice d'un forum de collectionneurs qui va bientôt fêter ses 4 ans.Pour l'événement, j'aimerais intégrer un javascript qui anim
|
 Téléchargements
Logiciels à télécharger sur le même thème :
Comparez les prix Nouvelle version
LG KP501
Entre 9€ et 159€
|