Sujet Précédent Sujet Suivant

Placement aléatoire d'image sur clic

projer Messages postés 112 Date d'inscription lundi 6 avril 2009 Statut Membre Dernière intervention 17 janvier 2015 - 19 févr. 2010 à 08:51
seblechinois Messages postés 72 Date d'inscription mercredi 27 décembre 2000 Statut Membre Dernière intervention 16 mai 2016 - 19 févr. 2010 à 14:21
Bonjour,

je me mets tout juste à javascript et je bute sur un problème...

En fait, j'ai placé 3 photos dans des td et je veux que sur un clic sur une des photos, qu'elles se replacent aléatoirement.

Pour l'instant, j'essaye juste de placer la première photo choisie aléatoirement dans la première td, après j'utiliserai splice je pense et choisirai aléatoirement une des 2 autres photos puis re splice et affichage de la dernière.

Voici ce que j'ai fait et qui ne fonctionne pas :

<head>
<script language="JavaScript">

function mix() {
tbimage=new Array("photo0","photo1","photo2");
var imageAleatoire=Math.round(Math.random()*3);
document.getElementById("image0").rows[0].cells[0].appendChild(document.createElement('a')); document.getElementById("image0").rows[0].cells[0].lastChild.appendChild(document.createElement('img')); document.getElementById("image0").rows[0].cells[0].lastChild.lastChild.style.height="150px"; document.getElementById("image0").rows[0].cells[0].lastChild.lastChild.src='images/'+tbimage[imageAleatoire]+'.jpg';
}
</script>
</head>





,

,






</html>

--------------------------------------------------------

http://www.projer.fr - dev web
http://www.lysdesign.fr - DA print / web - Illustratrice

7 réponses

Réponse 1 / 7
projer Messages postés 112 Date d'inscription lundi 6 avril 2009 Statut Membre Dernière intervention 17 janvier 2015
19 févr. 2010 à 11:43
J'ai avancé un peu mais ce n'est pas concluant car parfois des td sont vides, parfois on a 2 fois la même photo et je ne l'explique pas mais au 2° click, il me remet systématiquement les photos telles qu'elles sont au démarrage...

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script language="JavaScript">
function mix() {
var tbimage=new Array("d7","d7_02","d7_03");
for(i=0;i<3;i++){
var imageAleatoire=Math.round(Math.random()*tbimage.length);
document.getElementById("images").insertCell(0)
document.getElementById("images").cells[0].appendChild(document.createElement('a')).href='';
document.getElementById("images").cells[0].lastChild.appendChild(document.createElement('img'));
document.getElementById("images").cells[0].lastChild.lastChild.style.height="150px"
document.getElementById("images").cells[0].lastChild.lastChild.src='images/'+tbimage[imageAleatoire]+'.jpg'
tbimage.slice(imageAleatoire,imageAleatoire)
document.getElementById("images").deleteCell(3)
}
}
</script>
</head>



,
,





</html>


--------------------------------------------------------

http://www.projer.fr - dev web
http://www.lysdesign.fr - DA print / web - Illustratrice
0
Réponse 2 / 7
projer Messages postés 112 Date d'inscription lundi 6 avril 2009 Statut Membre Dernière intervention 17 janvier 2015
19 févr. 2010 à 12:40
apparemment slice ne fonctionne pas comme je l'avais compris, comment enlever une case d'un tableau?

--------------------------------------------------------

http://www.projer.fr - dev web
http://www.lysdesign.fr - DA print / web - Illustratrice
0
Réponse 3 / 7
projer Messages postés 112 Date d'inscription lundi 6 avril 2009 Statut Membre Dernière intervention 17 janvier 2015
19 févr. 2010 à 12:57
Mon dernier essai, toujours le même problème de case parfois vide, j'ai modifié le code pour qu'il lance le chargement des images au début au lieu de les mettre en fixe :

<head>
<script language="JavaScript">
function mix0() {
tbimage=new Array("d7","d7_02","d7_03");
for(i=0;i<3;i++){ imagealeatoire=Math.round(Math.random()*tbimage.length);

document.getElementById("images").insertCell(0)
document.getElementById("images").cells[0].appendChild(document.createElement('a')).href='';
document.getElementById("images").cells[0].lastChild.appendChild(document.createElement('img'));
document.getElementById("images").cells[0].lastChild.lastChild.style.height="150px";
document.getElementById("images").cells[0].lastChild.lastChild.src='images/'+tbimage[imagealeatoire]+'.jpg';
tbimage.splice(imagealeatoire);
}
}

function mix() {
for(i=0;i<3;i++){
document.getElementById("images").deleteCell(0)
}
mix0();
}
</script>
</head>








</html>


Un peu d'aide serait la bienvenue, vous remerciant d'avance :)

--------------------------------------------------------

http://www.projer.fr - dev web
http://www.lysdesign.fr - DA print / web - Illustratrice
0
Réponse 4 / 7
seblechinois Messages postés 72 Date d'inscription mercredi 27 décembre 2000 Statut Membre Dernière intervention 16 mai 2016 1
19 févr. 2010 à 14:01
Bonjour,

Je pense que les cases vides sont dus à Math.random() qui renvoie une valeur entre 0 et 1.
Donc 0 * 3(taille tableau) 0 et 1 * 3(taille tableau) 3 => 4 indices (0, 1, 2 et 3) possibles pour le tableau => case vide
0

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

Posez votre question
Réponse 5 / 7
projer Messages postés 112 Date d'inscription lundi 6 avril 2009 Statut Membre Dernière intervention 17 janvier 2015
19 févr. 2010 à 14:09
Il ne renvoie pas que 2 valeurs random, il renvoi un entier compris entre 0 et 1, que je multiplie par la longueur du tableau et que j'arrondi après

exemples :
si random =0.05 => imagealeatoire=arrondi(0.05*3)=arrondi(0.15)=0
si random =0.25 => imagealeatoire=arrondi(0.25*3)=arrondi(0.75)=1
si random =0.7 => imagealeatoire=arrondi(0.7*3)=arrondi(2.1)=2

Donc mon chiffre aléatoire sera bien compris entre 0 et 2

--------------------------------------------------------

http://www.projer.fr - dev web
http://www.lysdesign.fr - DA print / web - Illustratrice
0
Réponse 6 / 7
seblechinois Messages postés 72 Date d'inscription mercredi 27 décembre 2000 Statut Membre Dernière intervention 16 mai 2016 1
19 févr. 2010 à 14:17
Re,
De plus, apparemment la méthode splice écrase la tranche mais ne change pas les indices!
Donc il vaut peut-être mieux garder en mémoire les indices qui ont déjà été choisis. En passant par une table de hashage par exemple (http://weblogs.asp.net/ssadasivuni/archive/2003/09/17/27902.aspx) ou autre.
0
Réponse 7 / 7
seblechinois Messages postés 72 Date d'inscription mercredi 27 décembre 2000 Statut Membre Dernière intervention 16 mai 2016 1
19 févr. 2010 à 14:21
Re,

Il ne renvoie pas que 2 valeurs random, il renvoi un entier compris entre 0 et 1, que je multiplie par la longueur du tableau et que j'arrondi après

Oui, je sais j'ai pris les valeurs extrêmes pour l'exemple!


exemples :
si random =0.05 => imagealeatoire=arrondi(0.05*3)=arrondi(0.15)=0
si random =0.25 => imagealeatoire=arrondi(0.25*3)=arrondi(0.75)=1
si random =0.7 => imagealeatoire=arrondi(0.7*3)=arrondi(2.1)=2


Mais si random =0.9 => imagealeatoire=arrondi(0.9*3)=arrondi(2.7)=3!
Si je ne me trompe pas.
0

Discussions similaires

Récupération d'un mot aléatoire depuis un fichier texte
mornaloce -
buno -

24 réponses
piocher une image aléatoirement
mikouRoux -
kohntark -

5 réponses
génerateur de nombre aléatoire
cs_samnick -
rt15 -

8 réponses
recuperer tirages numero roulette casino en ligne
rapido6 -
khemarak -

12 réponses
Aidez moi pour charger une image aléatoire svp
cs_rorox -
cs_rorox -

5 réponses
Rejoignez-nous