Le Jeu de
Memory
Un jeu bien connu, qui
consiste à retrouver des paires dans un jeu de cartes dont la face
est cachée.
Le jeu indexant les
images dans l'ordre où elles sont affiché sur la page, La page ne
doit pas contenir d'autre image (à la rigueur après le
jeu).
Par contre, vous pouvez
l'intégrer dans une autre page (comme ici) en l'ouvrant dans une
IFRAME :
<IFRAME src="memory.htm" name="memory"
height="500" width="560"></IFRAME>
Vous pouvez aussi
l'ouvrir dans une Pop Up.
Quelques exemples ici
Insérez le code
ci-dessous dans l'entête de votre page (entre les
balises<head> ... </head>)
<script language="JavaScript"> <!-- //PLF-
http://www.jejavascript.net/ function
nb_aleatoire(nb) { nombre= Math.floor(Math.random() *
nb)+1; }
// variables********* nbc=12
//nombre de cartes multiple de 4 non_im="imag" //début du nom des image =>
nomimage(n°).gif // n°= 00 image vide ou transparente - 0
dos carte - de 1 à 6 pour 12 cartes (6 paires) // il faut
aussi une image gagne.gif
tirage = new Array;//tirage aléatoire place = new
Array; choix=0;nbim2=0;nbim3=0; choixim=1 gain=0; nombres=""; divs=nbc/2; nb=nbc+1; cpt=0;
for (i=1 ;i<nb
;i++) { nb_aleatoire(nbc); tirage[i]= nombre; for
(t=1 ; t<i ;t++){ if
(tirage[t]==nombre) { i=i-1; }}} for (i=1 ;i<nb
;i++) { if (tirage[i]>divs)
nbtire=tirage[i]-divs; else
nbtire=tirage[i]; place[i]=nbtire; }
function change_im(nbim) { // if (place[nbim] !=0)
{ if (nbim==nbim2) nbim=0; else{ if (nbim==nbim3)
nbim=0; else{ if (choixim==3) { if (val1==val2)
{efface(nbim2);efface(nbim3);gain++;} else
{no_efface(nbim2);no_efface(nbim3);} choixim=1;nbim3=0 } if
(choixim==1) {nbim2=nbim;val1=place[nbim];choix++;} if
(choixim==2)
{nbim3=nbim;val2=place[nbim];} choixim++; }} document.images[nbim-1].src
= non_im+place[nbim]+".gif"; if (choixim==3){if
(gain==divs-1)
{ setTimeout("efface(nbim2);efface(nbim3);document.images[1].src
=
'gagne.gif';",500);gain++; }} document.form1.result.value
= choix }}
function efface(eff) { document.images[eff-1].src =
non_im+"00.gif"; place[eff]=0}
function no_efface(eff) { document.images[eff-1].src =
non_im+"0.gif";}
//--> </script> |
nbc=12 : Indiquez le nombre de
cartes du jeu (multiple de 4) Si vous avez 6 images, donc 6
paires, il y a 12 cartes.
non_im="imag" indiquez le début
du nom des image, vos images devant toutes avoir le même début
suivant de leur numéro. Les images doivent aussi être toutes
de la même taille. Exemple avec imag nomimage(n°).gif imag00.gif
=>image transparente ou couleur du fond de la
page imag0.gif =>image du dos des carte imag1.gif,
imag2.gif, ..., imag6.gif => pour 12 cartes (6 paires).
Il faut aussi une image gagne.gif, qui s'affiche à la fin
du jeu.
Vous pouvez récupérez les images du jeu en bas de
page. |
Ensuite insérez le code
ci-dessous dans la balise <body>
<script language="JavaScript"> <!-- //PLF-
http://www.jejavascript.net/ document.write('<table
border="0" align="center">'); for (i=1 ;i<(nbc/4)+1
;i++){ document.write('<tr>'); for (t=1 ;t<5 ;
t++){ cpt++; document.write('<td><a href="#"
onClick="change_im('+(cpt)+')"><img
src="'+non_im+'0.gif" width="99" height="99"
border="0"></a></td>'); } document.write('</tr>'); } document.write('</table><p> </p>'+ '<form
name="form1">'+ '<table width="520" border="0"
align="center" bgcolor="#99FFFF">'+ '<tr><td
width="200" align="center">'+ 'Nombre de coups
'+ '<input name="result" type="text" id="result2"
size="5">'+ '</td><td width="100"
align="center">'+ '<input type="button" name="Submit"
onClick="window.location=\'memory.htm\'"
value="Rejouer">'+ '</td><td
align="center">'+ '<input type="button" name="Submit"
onClick="window.location=\'../index.htm\'"
value="Quiter">'+ '</td></tr><tr>'+ '<td
colspan="3">Le but du jeu est de retourner '+ 'les
cartes 2 par 2, afin de trouver les cartes
identiques</td>'+ '</tr></table></form>'); //--> <!--//PLF-
http://www.jejavascript.net/
//--> </script> |
memory.htm : Indiquez le nom
sous lequel vous avez nommé la page où se trouve le
jeux
../index.htm : Indiquez
le chemin et le nom du fichier à ouvrir en
quittant. Supprimez la ligne suivante, si vous placez le
jeu dans une iframe ou une popup : '<input
type="button" name="Submit" onClick="window.location=\'../index.htm\'"
value="Quiter">'+ |
Faire un clique droit sur chaque image, choix" Enregistrer
l'image sous..."
l'image transparente est entre le 1 et le 2
Ce site vous a plu
? Vous avez trouvé le script que vous cherchiez ?
Faites en
profiter vos visiteurs : insérez un lien sur votre
site