Animation

bonsoir, sa fait un moment.
hum, j'ai fait un peut de recherche sur le javascript et je viens de finir la fonction qui va caché mes images Et les faire reparaître. cependant je me demandais comment faire pour que, un individu puisse cliquer sur les images dans l'ordre dans lequel elle ont disparut pour gagné des point. Merci pour vos future conseille et passer une bonne soiré.
PS: voici ou je suis arriver dans mon code

//Fonction pour créer un tableau
function generation2() {
	img_touche = 0;
	var output = ' ';
	img_array.img_tile_shuffle();
	for (var i = 0; i < img_array.length; i++) {
		output += '<div id ="title_' + i + '" onclick="imgFlipTile(this, \'' + img_array[i] + '\')" style= "background-image : url(' + img_array[i] + ')"></div>';
	}
	document.getElementById('grille').innerHTML = output;
}

//fonction pour cacher les images

function animation1() {
	var element_id = [];
	var c = img_array.length;
	score = 0;

	for (i = 0; i < c; i++) {
		element_id[i] = i;
	}

	setInterval(function () {
		var rnd = Math.floor(Math.random() * Math.floor(element_id.length));

		if (document.getElementById("title_" + element_id[rnd]).style.visibility = "visible") {
			(document.getElementById("title_" + element_id[rnd]).style.visibility = "hidden")
		}
		element_id.splice(rnd, 1);					//supprime l'element caché
		c--;
	}, 2000);

	setTimeout(function(){
		for (i = 0; i < img_array.length; i++) {
			if (document.getElementById("title_" + i).style.visibility = "hidden") {
				(document.getElementById("title_" +i).style.visibility = "visible")
			}
		}},2000*img_array.length+3000)   //attend que la premiere partie fini avant de faire apparaitre les images;

}

salut,
il faut d'abord retenir cet ordre. Dans un tableau par exemple qui va enregistrer chaque valeur fournie par img_tile_shuffle(); et ensuite faire un autre tableau qui enregistre les clicks sur l'image, un truc du genre:

let tableauClick=[]
elementImage.addEventListener('click', function(e){
//-- détermine l'identifiant de l'image 
let numeroImage =  X;//-- avec this et 'e' on peut obtenir l'élément qui est cliqué, il suffit d'obtenir son numéro
//-- ajouter click
tableauClick.push(e.numeroImage);
//-- comparaison de la dernière image du tableau des clicks
if ( tableauOrdreApparition[tableauClick.length-1] == tableClick[numeroImage.length-1]){
//-- c'est bon on continue au clic suivant
}else{
//-- c'est pas bon on vide le tableau des clicks ou tout autre truc à faire
tableauClick=[];
}

);

Bien sûr rajouter la condition quand on arrive à la dernière image à trouver( tableImage.length = total des images)

bonsoir encore merci a tous pour votre aide.
la mon code est presque fini sinon pour le jouer je l'ai fait comme sa :

//  Le JOUER
var tab = [];
function joue(e) {
	tab.push(parseInt(e));
	document.getElementById("test2").innerHTML = JSON.stringify(tab);

	if (tab.length == get_id.length) {
		if (JSON.stringify(tab) == JSON.stringify(get_id)) {
			document.getElementById("test3").innerHTML = "bon";
			score++
		}
		else {
			document.getElementById("test3").innerHTML = "mauvais";
		}

	}
}

cependant j'ai voulu ajouté une fonction pour gere le score;
je voulais que mon score soit limité, il aurait commencer à exp: 0/5 et aurais augmenté quans les deux tab sont identique. Je me suis retrouve avec une boucle for qui ne fait rien puisse que je ne vois pas comment le faire tourné

/*function g_score() {
	score = 5
	for (i = 0; i < score; i++) {

	}
}*/

devrais-je fusionner les deux méthodes?

j'arrivais pas afficher mon score
le probleme etait que mon innerHTML etait dans mon if

score = 0;
var tab = [];
function joue(e) {
	tab.push(parseInt(e));
	document.getElementById("test2").innerHTML = JSON.stringify(tab);

	if (tab.length == get_id.length) {
		if (JSON.stringify(tab) == JSON.stringify(get_id)) {
			document.getElementById("test3").innerHTML = "bon";
			score++;
			tab = [];
			get_id = [];
			generation2();
		}
		else {

			document.getElementById("test3").innerHTML = "mauvais";
			score;
			tab = [];
			get_id = [];
			generation2();
			
		}
	} document.getElementById("divscore").innerHTML = score.toString();

}

voila le code il me reste a donner une limite au score. merci a tous

Salut

let score=0;
function addScore(){ score = score<5 ? score++ : score;}//- opérateur ternaire équivalent d'un if/else

donc

...
document.getElementById("test3").innerHTML = "bon";
addScore();