affichage images aléatoirement

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : affichage images aléatoirement

joyk

Salut,
j'ai crée un simple tableau en html et dans chaque case du tableau je voudrais mettre une photo. J'aimerai qu'à chaque affichage de la page les photos s'affichent dans un ordre aléatoire. J'ai trouvé un code java script qui permet d'afficher des images aléatoirement en piochant dans un dossier contenant toutes les images, ça fonctionne mais de cette manière il y a souvent des doublons dans les photos affichées.
Quelqu'un aurait il un code qui permettrait d'afficher toutes mes photos de manière aléatoire et sans doublon ?

Publicité

OrcusZ

Pro AMD | .Net lover

Salut,

Il suffit de gérer un second tableau d'exclusion pour sauvegarder les images et de les supprimer du premier tableau :

Code :

function randomImage(array, exclusion){
var arrayLength = array.length;
var index = Math.floor((Math.random() * arrayLength) + 0);
var image;
//on check que la valeur n'exhiste pas dans l'exclusion
if(array[index].indexOf(exclusion) < 0 || exclusion.length === 0){
//on ajoute l'image dans le tableau d'exclusion
exclusion.push(array[index]);
//on stocke l'image
image = array[index];
/* on le supprime pour éviter les doublons et de rentrer en stackoverflow a cause de la récurrence de la méthode */
array.splice(index,1);
return image
} else{
randomImage(array, exclusion);
}
}
var array = ["img1", "img2", "img3", "img4"];
var exclusion = [];
while(array.length !== 0){
var imageToDisplay = randomImage(array,exclusion);
console.log(imageToDisplay);
}

Voilà, tu pourra afficher tes images uniquement une fois ( il faudra que tu adapte un petit peu le code mais la logique est là )

le lien JSFiddle : https://jsfiddle.net/z6kdfryb/2/

Message édité par OrcusZ le 19-01-2016 à 10:04:01

---------------
Made you your own sentence without believing that of the others...

joyk

Merci pour ton aide mais je ne comprends pas bien, comment on fait ensuite pour afficher les photos ? on peut toujours utiliser la balise <img src=...> ?

OrcusZ

Pro AMD | .Net lover

Salut,

A la place du console log tu devra mettre du code javascript/jquery qui te permettra d'afficher les images ( function append ).

Si tu n'en a jamais fait, je te conseille de suivre un tutoriel car sinon tu sera vite limité pour faire ce genre d'effet

Bon courage

---------------
Made you your own sentence without believing that of the others...

FORUM HardWare.fr

Programmation

HTML/CSS

affichage images aléatoirement

Sujets relatifs
Affichage flux video RTSP Firefox	[C] Problème d'affichage dans le résultat de ma fonction C
WPF Affichage dynamique image	Résultat d'une requête différent entre phpmyadmin et l'affichage
Probleme d'affichage de mes enregistrements	Insérer des images avec légende dans word 2010
[MFC] [RESOLU] Affichage message avant fermeture d une fenetre	Comment programmer un tirage d'images au hasard ?
Images webcam	affichage tableaux apres choix select dynamique
Plus de sujets relatifs à : affichage images aléatoirement

Page générée en 0.036 secondes