http://www.jejavascript.net

ACCUEIL
ACCUEIL DES
  VISITEURS

DATE & HEURE
EFFETS DE TEXTE
FENETRES
FORMULAIRES
IMAGES
MENUS
PRATIQUE
POP UP
DIVERS

PHP
Cours de javascript
Générer vos Fichiers
  CSS

Générer vos Meta-Tags
Description des Balises
  Meta

Les Codes Couleur
L'objet Math
un Multi-Moteurs de recherche sur Votre Site
Cryptez votre e-mail
  pour contrer le Spam

Cryptez vos Scripts
Services Webmasters
Moteurs de recherches
Référencement



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>&nbsp;</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

ACCUEIL
Rechercher
Insérez dans vos
  favoris
Un lien sur votre site
Votre Lien sur JJS
Signez Mon Livre d'Or
Contact
Recettes faciles
Vos formulaires par mail
Creer votre Forum
Creer votre Livre d'or
Module de News
Creer votre Annuaire
Gestion de newsletters
Votre Agenda
Compteurs de Visites
Compteur Live
partenariats
Services Webmasters
ComScripts
Recherche javascript
Mes Partenaires

ABC Webmasters - un Partenaire

La BRETAGNE ça vous GAGNE ! - un Partenaire

annuaire gratuit - el-annuaire - un Partenaire

 
Je JavaScript Création Déc-2001

 
15-12-2010