Sujet Précédent Sujet Suivant

Jeu du memory

Fermé
jeudumemory Messages postés 14 Date d'inscription mardi 29 janvier 2019 Statut Membre Dernière intervention 14 mars 2019 - 29 janv. 2019 à 23:42
jean_chase Messages postés 8 Date d'inscription mercredi 5 septembre 2018 Statut Membre Dernière intervention 24 septembre 2019 - 20 sept. 2019 à 22:11
Bonjour, bonsoir,

Comme mon nom d'user l'indique et le titre du post j'aimerai crée un jeu du memory

sur une base de 5 PAR 7 case le but de l'opération ou le truc que j'aimerai savoir c'est que suivant ce que je monte via l'image que dois je faire ???

car je n'y arrive pas du tout :(



est ce que je dois faire un deux ou trois random ?

car j'aimerai que les cartes chance bombe et gagné soit a chaque fois mélangé

suivi de cela j'ai la face de demarrage a crée ici la photo est face caché

donc je ne comprend pas tres bien je peu fournir la base du code que j'ai fait mais ce n'est pas du

tout au point vue que ca fonctionne pas et sur la partie que j'ai crée je n'arrive pas a crée un menu

nouvelle partie...

voila est ce qu'il y aurai une personne qui aurai du temps a me consacrée ?

en tout cas je vous re merci d'avoir pris le temps de me lire et si l'envie vous dit de me venir en aide

bonne soirée pour les couches tard
bonne nuit pour les autres.




Configuration: Macintosh / Chrome 67.0.3396.87
A voir également:

14 réponses

Réponse 1 / 14
jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 4 650
30 janv. 2019 à 06:26
Bonjour

1- savoir dans quel langage tu codes...

2 - voir ton code.

Nb: a lire avant de poster sur ton code : https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code

.
0
Réponse 2 / 14
jeudumemory Messages postés 14 Date d'inscription mardi 29 janvier 2019 Statut Membre Dernière intervention 14 mars 2019
3 févr. 2019 à 19:33
Bonsoir merci pour votre réponse que je n’avais pas vue,
Alors le code est en JavaScript oui j’en est deux ! Un qui est presque fini qui fonctionne mais qui ne dispose pas de toute les nouvelles fonction que je voudrais avoir,

Le 2eme est toujours en JavaScript

Mais quand je fait un multiple random la c’est le bordel il ce fonctionne même pas :(

J’ai pas toute les bases et je ne comprend pas tout

Merci pour ton aide c’est simpa

Que voudrai tu que je te donne pour avancer ?

Bonne soirée et encore merci
0
jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 4 650
3 févr. 2019 à 21:59
Donc :
en JavaScript

- Je déplace donc ta question dans le forum Javascript.

Que voudrai tu que je te donne pour avancer ?

- Je t'ai demandé ton code ... donc.. ben... j'ai besoin de ton code...

Au passage... vu que ton souci concerne des codes javascript... le premier réflexe à avoir pour essayer de déterminer où se situe l'erreur.. c'est de regarder dans la console du navigateur si il n'y à pas des messages d'erreur...
0
Réponse 3 / 14
jeudumemory Messages postés 14 Date d'inscription mardi 29 janvier 2019 Statut Membre Dernière intervention 14 mars 2019
Modifié le 4 févr. 2019 à 13:39
Bonjour, merci pour votre retour,

voici le nouveau qui ne fonctionne pas du tout 
// JavaScript Document<HEAD> et </HEAD> 
<!-- DEBUT DU SCRIPT --> 

/* 


*/ 
imgLoaded = 0; 
CountAffichImg = new Array; 
PathImg = new Array; 
PassVerif = 0; 
ImgRecord = new Array; 
a1 = new Image; 
a2 = new Image; 
a2.src = 'images/ [https://image.noelshack.com/fichiers/2018/36/2/1536077526-univers.jpg%27 https://image.noelshack.com/fichiers/2018/36/2/1536077526-univers.jpg'|nofollow]; 
function loadImg() 
{ 
a1.src = "https://image.noelshack.com/fichiers/2019/06/1/1549277982-gagnc3a9-oas1lb.png"; 
CountImg(); 
a1.src = "https://image.noelshack.com/fichiers/2019/06/1/1549277982-gagnc3a9-oas1lb.png"; 
CountImg(); 
a1.src = "https://image.noelshack.com/fichiers/2019/06/1/1549277982-gagnc3a9-oas1lb.png"; 
CountImg(); 
a1.src = "https://image.noelshack.com/fichiers/2019/06/1/1549277928-48782.png"; 
CountImg(); 
a1.src = "https://image.noelshack.com/fichiers/2019/06/1/1549277928-48782.png"; 
CountImg(); 
a1.src = "https://image.noelshack.com/fichiers/2019/06/1/1549277928-48782.png"; 
CountImg(); 
a1.src = "https://image.noelshack.com/fichiers/2019/06/1/1549277928-48782.png"; 
CountImg(); 
a1.src = "https://image.noelshack.com/fichiers/2019/06/1/1549277928-48782.png"; 
CountImg(); 
a1.src = "https://image.noelshack.com/fichiers/2019/06/1/1549277928-48782.png"; 
CountImg(); 
a1.src = "https://image.noelshack.com/fichiers/2019/06/1/1549277907-chance.jpg"; 
CountImg(); 
a1.src = "https://image.noelshack.com/fichiers/2019/06/1/1549277907-chance.jpg"; 
CountImg(); 
a1.src = "https://image.noelshack.com/fichiers/2019/06/1/1549277907-chance.jpg"; 
CountImg(); 
RandomMem('i11',11); 
RandomMem('i12',12); 
RandomMem('i13',13); 
RandomMem('i14',14); 
RandomMem('i15',15); 
RandomMem('i16',16); 
RandomMem('i21',21); 
RandomMem('i22',22); 
RandomMem('i23',23); 
RandomMem('i24',24); 
RandomMem('i25',25); 
RandomMem('i26',26); 
RandomMem('i31',31); 
RandomMem('i32',32); 
RandomMem('i33',33); 
RandomMem('i34',34); 
RandomMem('i35',35); 
RandomMem('i36',36); 
RandomMem('i41',41); 
RandomMem('i42',42); 
RandomMem('i43',43); 
RandomMem('i44',44); 
RandomMem('i45',45); 
RandomMem('i46',46); 
document.messMem.mess.value = "Maintenant, retrouvez les paires..."; 
} 
function CountImg() 
{ 
PathImg[imgLoaded] = a1.src; 
CountAffichImg[imgLoaded] = 0; 
CountAffichImg[imgLoaded+12] = 0; 
imgLoaded++; 
return(true) 
} 
function RandomMem(imgName,ImgNb) 
{ 
ImgTemp = Math.round(Math.random() * 11); 
while (CountAffichImg[ImgTemp]>=2) 
{ 
ImgTemp = Math.round(Math.random() * 11); 
} 
ImgRecord[ImgNb] = PathImg[ImgTemp]; 
CountAffichImg[ImgTemp]++; 
return(true); 
} 
count = 0; 
gagne=0; 
function AddClic(ImgNb,ImgName) 
{ 
if (PassVerif == 0) 
{ 
if (ImgName.src != a2.src) 
{ 
alert('Cette image est déjà retournée'); 
} 
else 
{ 
ImgName.src = ImgRecord[ImgNb]; 
count++; 
ImgNamey = ImgName; 
if (count == 1) 
{ 
ImgNb1=ImgNb; 
ImgNamex=ImgNamey; 
ImgURL1=ImgRecord[ImgNb]; 
} 
else 
{ 
PassVerif=1; 
if (ImgRecord[ImgNb] == ImgURL1) 
{ 
gagne++; 
if (gagne > 1) s="s"; 
else s=""; 
document.messMem.mess.value = gagne + ' paire' + s + ' trouvée'; 
PassVerif = 0; 
count=0; 
if (gagne==12) 
{ 
document.messMem.mess.value = "Bravo, vous avez gagné!" 
} 
} 
else 
{ 
document.messMem.mess.value = "Ce n'est pas une paire"; 
tempoMem2 = setTimeout("ImgNamey.src='images/couple_cache.gif';ImgNamex.src='images/ [https://image.noelshack.com/fichiers/2018/36/4/1536221311-ps2.gif%27;document.messMem.mess.value https://image.noelshack.com/fichiers/2018/36/4/1536221311-ps2.gif';document.messMem.mess.value|nofollow] = 'Trouvez les paires';PassVerif = 0;", 1200); 
count=0; 
} 
} 
} 
} 
} 
ThisPage = location.href; 

<!-- FIN DU SCRIPT -->
0
Réponse 4 / 14
jeudumemory Messages postés 14 Date d'inscription mardi 29 janvier 2019 Statut Membre Dernière intervention 14 mars 2019
Modifié le 4 févr. 2019 à 13:39
celui la fonctionne mais c'est nul ^^ 
<html>
<title>JEUX DU MEMORY</title>
</head>

<body>
</body>
</html>

   <h1 align="center">Retrouvez les 3 images identique </h1>

<!DOCTYPE html>
<html>
<head>
<style>
div#memory_board{
 

 background: url([https://image.noelshack.com/fichiers/2018/36/2/1536077526-univers.jpg]) no-repeat;
 border:#999 1px solid;
 width:800px;
 height:540px;
 padding:24px;
 margin:0px auto;
}
div#memory_board > div{
 background: url([https://image.noelshack.com/fichiers/2019/06/1/1549277928-48782.png]) repeat-x;
 border:#000 1px solid;
 width:71px;
 height:71px;
 float:left;
 margin:10px;
 padding:20px;
 font-size:64px;
 cursor:pointer;
 text-align:center;
}
</style>
<script>

var memory_array = ['A','A','B','B','C','C','D','D','E','E','F','F','G','G','H','H','I','I','J','J','K','K','L','L'];
var memory_values = [];
var memory_tile_ids = [];
var tiles_flipped = 0;
Array.prototype.memory_tile_shuffle = function(){
    var i = this.length, j, temp;
    while(--i > 0){
        j = Math.floor(Math.random() * (i+1));
        temp = this[j];
        this[j] = this[i];
        this[i] = temp;
    }
}
function newBoard(){
 tiles_flipped = 0;
 var output = '';
    memory_array.memory_tile_shuffle();
 for(var i = 0; i < memory_array.length; i++){
  output += '<div id="tile_'+i+'" onclick="memoryFlipTile(this,\''+memory_array[i]+'\')"></div>';
 }
 document.getElementById('memory_board').innerHTML = output;
}
function memoryFlipTile(tile,val){
 if(tile.innerHTML == "" && memory_values.length < 2){
  tile.style.background = '#FFF';
  tile.innerHTML = val;
  if(memory_values.length == 0){
   memory_values.push(val);
   memory_tile_ids.push(tile.id);
  } else if(memory_values.length == 1){
   memory_values.push(val);
   memory_tile_ids.push(tile.id);
   if(memory_values[0] == memory_values[1]){
    tiles_flipped += 2;
    // Clear both arrays
    memory_values = [];
             memory_tile_ids = [];
    // Check to see if the whole board is cleared
    if(tiles_flipped == memory_array.length){
     alert("Board cleared... generating new board");
     document.getElementById('memory_board').innerHTML = "";
     newBoard();
    }
   } else {
    function flip2Back(){
        // Flip the 2 tiles back over
        var tile_1 = document.getElementById(memory_tile_ids[0]);
        var tile_2 = document.getElementById(memory_tile_ids[1]);
        tile_1.style.background = 'url(tile_bg.jpg) no-repeat';
                 tile_1.innerHTML = "";
        tile_2.style.background = 'url(tile_bg.jpg) no-repeat';
                 tile_2.innerHTML = "";
        // Clear both arrays
        memory_values = [];
                 memory_tile_ids = [];
    }
    setTimeout(flip2Back, 700);
   }
  }
 }
}
</script>
</head>
<body>
<div id="memory_board"></div>
<script>newBoard();</script>
</body>
</html>
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 14
jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 4 650
4 févr. 2019 à 13:38
Par contre.. je t'avais indiqué :

Nb: a lire avant de poster sur ton code : https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code


J'édite tes messages pour les mettre.... merci d'y penser à l'avenir
0
Réponse 6 / 14
jeudumemory Messages postés 14 Date d'inscription mardi 29 janvier 2019 Statut Membre Dernière intervention 14 mars 2019
4 févr. 2019 à 13:59
D'accord je vois que cela fait plus propre a lire :0

merci pour ta patience
0
Réponse 7 / 14
jeudumemory Messages postés 14 Date d'inscription mardi 29 janvier 2019 Statut Membre Dernière intervention 14 mars 2019
4 févr. 2019 à 23:14
Je viens de me rendre compte que meme dans celui qui fonctionne il y a une grosse erreur -__-'' !
0
Réponse 8 / 14
jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 4 650
5 févr. 2019 à 09:13
On va reposer les choses à plat...
- Tu as donc une grille 7*5
- As tu toujours le même nombre de cartes chances , de cartes bombes ?


0
jeudumemory Messages postés 14 Date d'inscription mardi 29 janvier 2019 Statut Membre Dernière intervention 14 mars 2019
5 févr. 2019 à 09:37
Bonjour, oui 7 par 5 et oui j'ai toujours le meme nombres de bombes de carte chance.
0
jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 4 650
5 févr. 2019 à 10:07
Par contre, dans l'image que tu nous as donné au départ.. c'est du 8 * 5 si je ne m'abuse....
Si on fait du 7*5 tu auras un nombre impair...
0
Réponse 9 / 14
jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 4 650
5 févr. 2019 à 14:02
Que penses tu d'un truc du genre... 
<! DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta name="keywords" content="">
  <title>TEST</title>
  <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
  <link href="styles/styles.css" rel="stylesheet" type="text/css">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <style>
    .carte{
      width:80px;
      height:80px;
      background-color:#999222;
      border: 1px solid light-grey;
    }
  </style>
</head>
<body>
 <table>
 <tbody id="affichage">
 </tbody>
 </table>
 
<script type="text/javascript">
var cible = document.getElementById('affichage');
var nbCol = 7;
var nbLignes = 5;
var nbGagne = 2;
var nbChances = 4 ;
var nbCards = nbCol * nbLignes;
var previouscard = null;
var defaultImg = 'https://image.noelshack.com/fichiers/2018/36/2/1536077526-univers.jpg';
var imgs = {
  A:"https://image.noelshack.com/fichiers/2019/06/1/1549277928-48782.png",
  C:"https://image.noelshack.com/fichiers/2019/06/1/1549277907-chance.jpg",
  G:"https://image.noelshack.com/fichiers/2019/06/1/1549277982-gagnc3a9-oas1lb.png",
}

function InitCards(){
  var cards = [];
  if(nbChances + nbGagne > nbCards ){
    alert('Attention : Nombre de cartes incohérent !!!');
  }
   
  for (var g=1; g<=nbGagne; g++){
    cards.push("G");  
  }
  for (var c=1; c<=nbChances; c++){
    cards.push("C");  
  }
  
  var reste = nbGagne + nbChances + 1;
  for(var a=reste; a<=nbCards;a++){
    cards.push("A");
  }
  
  return cards;
}

/**
 * Shuffles array in place.
 * @param {Array} a items An array containing the items.
 */
function shuffle(a) {
    var j, x, i;
    for (i = a.length - 1; i > 0; i--) {
        j = Math.floor(Math.random() * (i + 1));
        x = a[i];
        a[i] = a[j];
        a[j] = x;
    }
    return a;
}

function createGrid(cards){
  var x=1;
  var html = "";
  
  for(var l=1;l<=nbLignes;l++){
    html +="<tr>";
    for(var c=1;c<=nbCol;c++){
      html +="<td id='td_"+x+"'>";
      html += '<img src="'+defaultImg+'" alt="C[' + x + ']"  data-retournee="0" data-cardid="'+x+'" class="carte"></img>';      
      x++;
    }
    html +="</tr>";
  }
  cible.innerHTML =html;  
  initClickCards(cards);
}

function initClickCards(cards){
  document.body.onclick= function(e){
     e=window.event? event.srcElement: e.target;
     if(e.className && e.className.indexOf('carte')!=-1){
        var cardid = e.getAttribute('data-cardid');
        var retournee = e.getAttribute('data-retournee');
        var cartesRetournees = document.querySelectorAll("[data-retournee='1']");
        var nbFlipCard = cartesRetournees.length;
        
        console.log('On retourne la Carte : ' + cardid );
        e.setAttribute('data-retournee','1');
        e.src = imgs[cards[cardid-1]];
        if(nbFlipCard == 1){
          if(cards[cardid-1] == previouscard){
            if(previouscard == "C" ){
              setTrouveePair();
              previouscard = null;
            }else if(previouscard == "A"){
              alert('PERDU !');
            }else if(previouscard=="G"){
              alert("GAGNE !!");
            }
          }else{
            previouscard = null;
            setTimeout(function(){ flipBack(); }, 1000);
            
          }
        }else{
          previouscard = cards[cardid-1];
        }
        
     }
  }
}


function flipBack(){
  var cartesRetournees = document.querySelectorAll("[data-retournee='1']");
  for (i = 0; i < cartesRetournees.length; ++i) {
    cartesRetournees[i].src = defaultImg; 
    cartesRetournees[i].setAttribute('data-retournee','0');   
  }
}

function setTrouveePair(){
  var cartesRetournees = document.querySelectorAll("[data-retournee='1']");
  for (i = 0; i < cartesRetournees.length; ++i) {
    cartesRetournees[i].setAttribute('data-retournee','2'); 
  }
}

//-------------------------------------------------------------------------------//
var arrCards = InitCards();
var arrCardsRdm = shuffle(arrCards);
console.table("arrCardsRdm",arrCardsRdm);

createGrid(arrCardsRdm);

</script>
</body>
</html>

0
jean_chase Messages postés 8 Date d'inscription mercredi 5 septembre 2018 Statut Membre Dernière intervention 24 septembre 2019
20 sept. 2019 à 22:11
sa semble bien.
désolé de répondre tardivement. J'ai une activité qui me prend du temps je ne pourrais pas répondre message avant dimanche soir.
je te reviendrai d'ici la après avoir regarder le code en détaille.
0
Réponse 10 / 14
jeudumemory Messages postés 14 Date d'inscription mardi 29 janvier 2019 Statut Membre Dernière intervention 14 mars 2019
6 févr. 2019 à 09:24
Bonjour et merci pour vos reponse je n'ai pas eu le temps de me connecter hier sauf le matin.
Alors pour répondre effectivement je suis passé en 5*8 car j'ai changer de stratégie de jeux je partait sur un jeu du mémory, mais après réflexion je suis plus dirigé vers un démineur version 2018 ^^

d'ou le changement de code :)

alors j'ai bien aimé votre/ta correction donc il est fonctionnel ( toujours mieux que moi ou il ne fonctionne pas du tout )

Quand je tombe sur une bombe je ne devrai pas pouvoir continué,
Je dois ajouter une ligne pour recharger la page a ce moment la ?

pour ce qui est des carte chance et gagné je voudrai avoir le meme nombre de case
donc j'ai modifier la valeur en 3 et 3

merci encore et encore pour ton aide :)
0
Réponse 11 / 14
jeudumemory Messages postés 14 Date d'inscription mardi 29 janvier 2019 Statut Membre Dernière intervention 14 mars 2019
6 mars 2019 à 15:42
Merci pour ton aide j'ai pu avancer malgré que je n'avais pas vraiment beaucoup de temps j'ai modifier un peu le code mais je rencontre encore des erreurs est ce que je peu mettre le code et me dire ou cela cloche ?

Bonne journée.
0
jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 4 650
6 mars 2019 à 16:22
Oui... c'est le principe du forum :-)
0
jeudumemory Messages postés 14 Date d'inscription mardi 29 janvier 2019 Statut Membre Dernière intervention 14 mars 2019
11 mars 2019 à 12:40
Meric :)
0
Réponse 12 / 14
jeudumemory Messages postés 14 Date d'inscription mardi 29 janvier 2019 Statut Membre Dernière intervention 14 mars 2019
Modifié le 11 mars 2019 à 12:41 
<!DOCTYPE html>
<html>
<head>
    <title>Trouve les 3 images identique un gagne un super lot!</title>
</head>

<body>


    <script>
        alert('Vous devez retourner des cartes et tomber sur 2 \'Gagné\'\nBonne Chance');
    </script>

</body>
</html>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta name="keywords" content="">
  <title>TEST</title>
  <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
  <link href="styles/styles.css" rel="stylesheet" type="text/css">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <style>
    .carte{
      width:80px;
      height:80px;
      background-color:#999222;
      border: 1px solid light-grey;
    }
  </style>
</head>
<body>
 <table>
 <tbody id="affichage">
 </tbody>
 </table>
 
 
 
<script type="text/javascript">
var cible = document.getElementById('affichage');
var nbCol = 7;
var nbLignes = 5;
var nbGagne = 3;
var nbChances = 3 ;
var nbCards = nbCol * nbLignes;
var previouscard = null;
var defaultImg = 'https://image.noelshack.com/fichiers/2018/36/2/1536077526-univers.jpg';
var imgs = {
  A:"https://image.noelshack.com/fichiers/2019/06/1/1549277928-48782.png",
  C:"https://image.noelshack.com/fichiers/2019/06/1/1549277907-chance.jpg",
  G:"https://image.noelshack.com/fichiers/2019/06/1/1549277982-gagnc3a9-oas1lb.png",
}

function InitCards(){
  var cards = [];
  if(nbChances + nbGagne > nbCards ){
    alert('Attention : Nombre de cartes incohérent !!!');
  }
   
  for (var g=1; g<=nbGagne; g++){
    cards.push("G");  
  }
  for (var c=1; c<=nbChances; c++){
    cards.push("C");  
  }
  
  var reste = nbGagne + nbChances + 1;
  for(var a=reste; a<=nbCards;a++){
    cards.push("A");
  }
  
  return cards;
}

/**


* Shuffles array in place.

* @param {Array} a items An array containing the items.

*/
function shuffle(a) {
    var j, x, i;
    for (i = a.length - 1; i > 0; i--) {
        j = Math.floor(Math.random() * (i + 1));
        x = a[i];
        a[i] = a[j];
        a[j] = x;
    }
    return a;
}

function createGrid(cards){
  var x=1;
  var html = "";
  
  for(var l=1;l<=nbLignes;l++){
    html +="<tr>";
    for(var c=1;c<=nbCol;c++){
      html +="<td id='td_"+x+"'>";
      html += '<img src="'+defaultImg+'" alt="C[' + x + ']"  data-retournee="0" data-cardid="'+x+'" class="carte"></img>';      
      x++;
    }
    html +="</tr>";
  }
  cible.innerHTML =html;  
  initClickCards(cards);
}

function initClickCards(cards){
  document.body.onclick= function(e){
     e=window.event? event.srcElement: e.target;
     if(e.className && e.className.indexOf('carte')!=-1){
        var cardid = e.getAttribute('data-cardid');
        var retournee = e.getAttribute('data-retournee');
        var cartesRetournees = document.querySelectorAll("[data-retournee='1']");
        var nbFlipCard = cartesRetournees.length;
        
        //console.log('On retourne la Carte : ' + cardid );
        e.setAttribute('data-retournee','1');
        e.src = imgs[cards[cardid-1]];
        if(nbFlipCard == 1){
          if(cards[cardid-1] == previouscard){
            if(previouscard == "C" ){
              setTrouveePair();
              previouscard = null;
            }else if(previouscard == "A"){
              alert('PERDU !');
              location.reload();
            }else if(previouscard=="G"){
              alert("GAGNE !!");
              location.reload();
            }
          }else{
            previouscard = null;
            setTimeout(function(){ flipBack(); }, 1000);
            
          }
        }else{
          previouscard = cards[cardid-1];
        }
        
     }
  }
}


function flipBack(){
  var cartesRetournees = document.querySelectorAll("[data-retournee='1']");
  for (i = 0; i < cartesRetournees.length; ++i) {
    cartesRetournees[i].src = defaultImg; 
    cartesRetournees[i].setAttribute('data-retournee','0');   
  }
}

function setTrouveePair(){
  var cartesRetournees = document.querySelectorAll("[data-retournee='1']");
  for (i = 0; i < cartesRetournees.length; ++i) {
    cartesRetournees[i].setAttribute('data-retournee','2'); 
  }
}

//-------------------------------------------------------------------------------//
var arrCards = InitCards();
var arrCardsRdm = shuffle(arrCards);
//console.table("arrCardsRdm",arrCardsRdm);

createGrid(arrCardsRdm);

</script>
</body>
</html>


EDIT : Correction des balises de code
0
jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 4 650
11 mars 2019 à 12:43
Visiblement tu n'as toujours pas compris comment on utilise les balises de code....
Je t'invite donc à relire l'explication : https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code

et à l'appliquer correctement la prochaine fois.

Ensuite... ton code est en html / javascript .... pas en JAVA.

Et enfin.. tu dis avoir des erreurs... lesquelles ?
Que t'affiche la console de ton navigateur ?

Merci de détailler ton souci sans qu'on ait systématiquement besoin de le tester par nous même pour chercher les erreurs....
0
Réponse 13 / 14
jeudumemory Messages postés 14 Date d'inscription mardi 29 janvier 2019 Statut Membre Dernière intervention 14 mars 2019
11 mars 2019 à 12:44
Bonjour, désolé de mon retour tardive.

Alors j'aimerai changer le comportement du jeu

en gros quand je tombe sur Deux bombes parfait çà relance la partie.

Par contre quand je trouve sur une carte gagné celle-ci disparais est ce que c'est possible de la laisser validé et de pouvoir continué a trouver les 2 manquantes ?

Je voudrai trouver non pas deux mais 3 cartes chance.

je donne le code édité juste après :)

Merci pour tes conseilles.
0
jordane45 Messages postés 38144 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 21 avril 2024 4 650
11 mars 2019 à 12:53

Par contre quand je trouve sur une carte gagné celle-ci disparais est ce que c'est possible de la laisser validé et de pouvoir continué a trouver les 2 manquantes ?

Ce ne sont pas des erreurs...... c'est plutôt une évolution de ton code.....

Mais si tu reprends le code que je t'avais donné la dernière fois.. tu y verras déjà le comportement voulu ( avec deux cartes ).
Il te suffit donc de l'adapter.

reviens nous voir avec tes tentatives SI tu rencontres des soucis.
En attendant... je ne vais pas faire le code à ta place.
0
jeudumemory Messages postés 14 Date d'inscription mardi 29 janvier 2019 Statut Membre Dernière intervention 14 mars 2019
14 mars 2019 à 19:46
Okay merci pour ton retour je vais essayer demain 1ere heur :)
Encore merci pour tout
Bonne soirée à très vite
0
Réponse 14 / 14
jeudumemory Messages postés 14 Date d'inscription mardi 29 janvier 2019 Statut Membre Dernière intervention 14 mars 2019
11 mars 2019 à 12:45 
<!DOCTYPE html>
<html>
<head>
    <title>Trouve les 3 images identique un gagne un super lot!</title>
</head>

<body>


    <script>
        alert('Vous devez retourner des cartes et tomber sur 2 \'Gagné\'\nBonne Chance');
    </script>

</body>
</html>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta name="keywords" content="">
  <title>TEST</title>
  <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
  <link href="styles/styles.css" rel="stylesheet" type="text/css">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <style>
    .carte{
      width:80px;
      height:80px;
      background-color:#999222;
      border: 1px solid light-grey;
    }
  </style>
</head>
<body>
 <table>
 <tbody id="affichage">
 </tbody>
 </table>
 
 
 
<script type="text/javascript">
var cible = document.getElementById('affichage');
var nbCol = 7;
var nbLignes = 5;
var nbGagne = 3;
var nbChances = 3 ;
var nbCards = nbCol * nbLignes;
var previouscard = null;
var defaultImg = 'https://image.noelshack.com/fichiers/2018/36/2/1536077526-univers.jpg';
var imgs = {
  A:"https://image.noelshack.com/fichiers/2019/06/1/1549277928-48782.png",
  C:"https://image.noelshack.com/fichiers/2019/06/1/1549277907-chance.jpg",
  G:"https://image.noelshack.com/fichiers/2019/06/1/1549277982-gagnc3a9-oas1lb.png",
}

function InitCards(){
  var cards = [];
  if(nbChances + nbGagne > nbCards ){
    alert('Attention : Nombre de cartes incohérent !!!');
  }
   
  for (var g=1; g<=nbGagne; g++){
    cards.push("G");  
  }
  for (var c=1; c<=nbChances; c++){
    cards.push("C");  
  }
  
  var reste = nbGagne + nbChances + 1;
  for(var a=reste; a<=nbCards;a++){
    cards.push("A");
  }
  
  return cards;
}

/**
 * Shuffles array in place.
 * @param {Array} a items An array containing the items.
 */
function shuffle(a) {
    var j, x, i;
    for (i = a.length - 1; i > 0; i--) {
        j = Math.floor(Math.random() * (i + 1));
        x = a[i];
        a[i] = a[j];
        a[j] = x;
    }
    return a;
}

function createGrid(cards){
  var x=1;
  var html = "";
  
  for(var l=1;l<=nbLignes;l++){
    html +="<tr>";
    for(var c=1;c<=nbCol;c++){
      html +="<td id='td_"+x+"'>";
      html += '<img src="'+defaultImg+'" alt="C[' + x + ']"  data-retournee="0" data-cardid="'+x+'" class="carte"></img>';      
      x++;
    }
    html +="</tr>";
  }
  cible.innerHTML =html;  
  initClickCards(cards);
}

function initClickCards(cards){
  document.body.onclick= function(e){
     e=window.event? event.srcElement: e.target;
     if(e.className && e.className.indexOf('carte')!=-1){
        var cardid = e.getAttribute('data-cardid');
        var retournee = e.getAttribute('data-retournee');
        var cartesRetournees = document.querySelectorAll("[data-retournee='1']");
        var nbFlipCard = cartesRetournees.length;
        
        //console.log('On retourne la Carte : ' + cardid );
        e.setAttribute('data-retournee','1');
        e.src = imgs[cards[cardid-1]];
        if(nbFlipCard == 1){
          if(cards[cardid-1] == previouscard){
            if(previouscard == "C" ){
              setTrouveePair();
              previouscard = null;
            }else if(previouscard == "A"){
              alert('PERDU !');
              location.reload();
            }else if(previouscard=="G"){
              alert("GAGNE !!");
              location.reload();
            }
          }else{
            previouscard = null;
            setTimeout(function(){ flipBack(); }, 1000);
            
          }
        }else{
          previouscard = cards[cardid-1];
        }
        
     }
  }
}


function flipBack(){
  var cartesRetournees = document.querySelectorAll("[data-retournee='1']");
  for (i = 0; i < cartesRetournees.length; ++i) {
    cartesRetournees[i].src = defaultImg; 
    cartesRetournees[i].setAttribute('data-retournee','0');   
  }
}

function setTrouveePair(){
  var cartesRetournees = document.querySelectorAll("[data-retournee='1']");
  for (i = 0; i < cartesRetournees.length; ++i) {
    cartesRetournees[i].setAttribute('data-retournee','2'); 
  }
}

//-------------------------------------------------------------------------------//
var arrCards = InitCards();
var arrCardsRdm = shuffle(arrCards);
//console.table("arrCardsRdm",arrCardsRdm);

createGrid(arrCardsRdm);

</script>
</body>
</html>
0

Discussions similaires

Bonjour svp ya t'il un site ou moyens pour avoir les bd de toomics gratuit
Ouragan -
madmyke -

1 réponse
Annuaire portable gratuit à partir d'un nom
dani26 -
Authority -

9 réponses