|
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é a 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 est egal à : 100% / par le nbr de cartes horizontale .*/
- /* Pour 4 cartes: 100%/4 = 25% */
- width: 25%;
-
- /* La Hauteur est egal à : 100% / par le nbr de cartes verticale .*/
- /* Pour 2 cartes: 100%/2 = 50% */
- height: 50%;
- }
-
- .Back{
- background-image: url(Back.jpg);
- }
-
- #TabCarte TD {
- background-image: url(Back.jpg);
- }
-
-
- </style>
-
- <SCRIPT language="JavaScript" type="text/JavaScript">
-
- var Gagner = 0;
- var Count = 0;
- var LastCarte = null;
-
- // 4 valeurs * 2 = 8 Cartes, 5 valeurs * 2 = 10 Cartes etc...
- var ArrayCartes = new Array("A", "B", "C", "D")
- var ArrayBis = ArrayCartes
- var ValueCarte = ArrayCartes.concat(ArrayBis);
- 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 OK = true;
- var Buffer = "";
- var Compteur = 0
-
- // 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)
- // Correction pour tirage > à 9 Cartes
- var reg = new RegExp("#"+Tirage+":", "gi") // FAUX: new RegExp("["+Tirage+"]", "g")
-
-
- if (!reg.test(Buffer))
- {
- ArrayDonne[Compteur] = ValueCarte[Tirage];
- // Correction pour tirage > a 9 Cartes
- Buffer += "#" + Tirage+ ":"; // FAUX: 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=50% align=center cellspacing="2" cellpadding="2" >
- <TR>
- <TD> Nbr Gagner : </TD><TD align=left id="NbrGagner"> </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>
- <TR>
- <TD colspan=2>
- <input id="Rejouer" type="button" value="Rejouer" onclick="InitCarte();" disabled>
- </TD>
- <TD colspan=2><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>
- </TR>
- </TABLE>
- <br>
- <TABLE border=0 width=50% height=70% 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 est egal à : 100% / par le nbr de cartes horizontale .*/
/* Pour 4 cartes: 100%/4 = 25% */
width: 25%;
/* La Hauteur est egal à : 100% / par le nbr de cartes verticale .*/
/* Pour 2 cartes: 100%/2 = 50% */
height: 50%;
}
.Back{
background-image: url(Back.jpg);
}
#TabCarte TD {
background-image: url(Back.jpg);
}
</style>
<SCRIPT language="JavaScript" type="text/JavaScript">
var Gagner = 0;
var Count = 0;
var LastCarte = null;
// 4 valeurs * 2 = 8 Cartes, 5 valeurs * 2 = 10 Cartes etc...
var ArrayCartes = new Array("A", "B", "C", "D")
var ArrayBis = ArrayCartes
var ValueCarte = ArrayCartes.concat(ArrayBis);
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 OK = true;
var Buffer = "";
var Compteur = 0
// 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)
// Correction pour tirage > à 9 Cartes
var reg = new RegExp("#"+Tirage+":", "gi") // FAUX: new RegExp("["+Tirage+"]", "g")
if (!reg.test(Buffer))
{
ArrayDonne[Compteur] = ValueCarte[Tirage];
// Correction pour tirage > a 9 Cartes
Buffer += "#" + Tirage+ ":"; // FAUX: 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=50% align=center cellspacing="2" cellpadding="2" >
<TR>
<TD> Nbr Gagner : </TD><TD align=left id="NbrGagner"> </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>
<TR>
<TD colspan=2>
<input id="Rejouer" type="button" value="Rejouer" onclick="InitCarte();" disabled>
</TD>
<TD colspan=2><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>
</TR>
</TABLE>
<br>
<TABLE border=0 width=50% height=70% 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()
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
Problème chargement image javascript [ par Travailleuuse06 ]
Bonjour,je suis devant un très gros problème que je n'arrive pas à résoudre. J'ai une page html où j'ai un <img src="image">Dans ma partie jav
Détecter est afficher les coordonées de la page du navigateur ??? [ par supergrey ]
Bon, déjà je précise qu'en javascript je suis un newbie. Je voudrais afficher dans la barre de titre du navigateur , la position de la fenetre du navi
texte initial dans un champ "input" [ par aztec78 ]
bonjour,voici mon problème :j'ai un petit programme en javascript qui transforme un texte d'un formulaire en zone de texte à modifier lorsque l'on cli
planning javascript [ par MATHIS49 ]
bonjour à tous ! Je cherche ce genre de chose (peut etre pas en si poussé) en javascript/php et en libre : <a href="
javascript et flash 4... oui, 4 :( [ par coucoucircus ]
Bonjour,Pour un projet professionnel, j'ai une petite contrainte technique qui mérite réfelxion, et j'aurais besoin d'une solution simple... Les conna
Javascript avec la lib moo.fx.js [ par BenXbox ]
Bonjour, Voilà je voudrais que quant je clique le triangle (fermer.gif) pour ouvrir une section il change d'image (ouvert.gif) avec la lib moo.fx.js
Empecher les alert() javascript dans une iframe [ par lolpop ]
Bonjour,je n'y connais rien en javascript.Mais j'aurais besoin de votre aide.Sur mon site, j'ai une iframe en bas de page ou défile les sites des visi
récupérer les données d'un form javascript dans base de données Access [ par daviddubois ]
Bonjour tout le monde, Y'a t'il moyen de récupérer les informations d'un formulaire javascript dans une base de données Access ? Que ça soit en P
hta, frames et javascript. [ par David78390 ]
Salut à tous, voici une synthese du sujet precedant: J'avais un probleme pour passer ma page index.html en index.hta: j'utilisais des javascript, et
|
Téléchargements
Logiciels à télécharger sur le même thème :
|