tirage aléatoire
bonjour à tous
voilà avec 22 cartes (22 images) je souhaite faire 1 tirage aléatoire de 4 cartes ki renvoie sur des pages html avec explication de ces cartes
je suppose ke c'est 1 fonction du style math random
mais je n'y arrive pas
kelkun a t-il une idée sur le genre de script
merci
salut,
effectivement ...
- definir une variable correspondant au nombre d'images.(var nbimage = 22;)
- definir un "new Array()" pour le N° de l'image.(numimg)
- definir la "function" .
- definir une variable (idx par exemple) et la boucler 4 fois (pour obtenir 4 images).
- N° de l'image : effectuer un Math.round(Math.random()*(nbimage-1)+1);
- definir une variable ( j ) et boucler sur idx pour comparer les resultats : if (numimg[idx] == numimg[j]) .
- si N° identiques on effectue un nouveau Math.round( etc) et on decremente la variable j de -1. (fin 2eme boucle)
- (fin 1ere boucle)
- sinon on attribue les valeurs aux images : numimg[0] pour la 1ere , numimg[1] pour la 2eme , etc ... idem pour les href.
pour plus de simplicité , on appellera les images de 1.jpg à 22.jpg (ou photo1.jpg à photo22.jpg) et les pages de 1.htm à 22.htm (ou page1.htm à page22.htm).
- appeler la "function" sur le onLoad de la page.
j'espere avoir été suffisamment clair , et ne pas avoir fait d'erreurs.
++
L.
bonjour je n'ai pas eu le temps de te répondre avant
ouai, c'est clair ce ke tu dis le blème c'est qu'en javascript je commence juste
je suppose ke toutes ces fonctions je les fais avec flash
si à 1 moment tu as un peu de temps pour expliciter tout cela
ce serait avec plaisir ke je te lirai
par exemple pour démarrer mes cartes seront non visible c.a.d 22 dos de cartes
faut-il qu'ils soient différenciés, les dos, parceque à mon avis ce n'est pas ça ki va compter
tu vois le genre de questions de départ que je me pose
en gros c'est pas gagné
je te remercie
tiens je n'ai pas encore mis mon site le volà :
http://e.bardiau.free.fr/
A + tard
re,
>>"je suppose ke toutes ces fonctions je les fais avec flash"
pas du tout ! forum javascript donc réponse javascript ...
un javascript qui va : "faire 1 tirage aléatoire de 4 cartes ki renvoie sur des pages html" (sur 22 images.)
>>"par exemple pour démarrer mes cartes seront non visible c.a.d 22 dos de cartes" , cela n'est pas prevu non plus , vu que ce n'etait pas précisé .
++
L.
ok réponse javascript
tu veux dire ke je monte tout le code (avec les acolades et touti quanti)
et c'est la ke j'ai 1 blème car j'arrive 1 peu à capter ce ki ce passe dans 1 code mais pour l'instant l'écrire c'est 1 autre histoire
alors kan j'en vois je les décortique déjà pour comprendre
je te l'ai dis je démarre
merci de ta réponse
ok,
je te le poste sous peu .
++
L.
ok merci beaucoup
re,
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Page Web</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<STYLE type=text/css>
BODY{
text-align:center; color: blue; FONT-SIZE: 11px; FONT-FAMILY: Arial, Helvetica; text-decoration:none;background-color: aliceblue;margin:0px;
}
#cont{
width:450px; border:1px solid blue; margin-left:auto; margin-right:auto;
}
.img{
width:100px; height:70px; margin-left:10px; border:0px;
}
</STYLE>
<SCRIPT LANGUAGE="JavaScript">
*/
Les images sont nommées de 1.jpg à 22.jpg , elles sont placées dans le sous-repertoire "photos".
les liens renvoient sur une page "blank" qui affiche les images en taille réelle.
Pour afficher une page.htm placée dans le sous-dossier pages : href = 'pages/'+ numimg[0] +'.htm';
Ici ce sont les mêmes images qui servent en onglets et taille réelle.
*/
var nbimage= 22;
numimg = new Array()
function look()
{
for (var idx = 0; idx < 4; idx++)
{
numimg[idx]= Math.round(Math.random()*(nbimage-1)+1);
for (var j = 0; j < idx; j++)
{
if (numimg[idx] == numimg[j]) // test identique
{
numimg[idx]= Math.round(Math.random()*(nbimage-1)+1);
j = -1;
}
}
}
if (document.all) // I.E (ancien , récent)
{
document.all('mypic1').src = 'photos/'+ numimg[0] +'.jpg'; // onglet
document.all('pge1').href = 'photos/'+ numimg[0] +'.jpg'; // page avec image grandeur réelle.
document.all('scr1').innerHTML = numimg[0]; // affiche le N° de la photo.
document.all('mypic2').src = 'photos/'+ numimg[1] +'.jpg';
document.all('pge2').href = 'photos/'+ numimg[1] +'.jpg';
document.all('scr2').innerHTML = numimg[1];
document.all('mypic3').src = 'photos/'+ numimg[2] +'.jpg';
document.all('pge3').href = 'photos/'+ numimg[2] +'.jpg';
document.all('scr3').innerHTML = numimg[2];
document.all('mypic4').src = 'photos/'+ numimg[3] +'.jpg';
document.all('pge4').href = 'photos/'+ numimg[3] +'.jpg';
document.all('scr4').innerHTML = numimg[3];
}
else if (document.getElementById) // I.E récent , netscape , mozilla.
{
document.getElementById('mypic1').src= 'photos/'+ numimg[0] +'.jpg';
document.getElementById('pge1').href= 'photos/'+ numimg[0] +'.jpg';
document.getElementById('scr1').innerHTML = numimg[0];
document.getElementById('mypic2').src= 'photos/'+ numimg[1] +'.jpg';
document.getElementById('pge2').href= 'photos/'+ numimg[1] +'.jpg';
document.getElementById('scr2').innerHTML = numimg[1];
document.getElementById('mypic3').src= 'photos/'+ numimg[2] +'.jpg';
document.getElementById('pge3').href= 'photos/'+ numimg[2] +'.jpg';
document.getElementById('scr3').innerHTML = numimg[2];
document.getElementById('mypic4').src= 'photos/'+ numimg[3] +'.jpg';
document.getElementById('pge4').href= 'photos/'+ numimg[3] +'.jpg';
document.getElementById('scr4').innerHTML = numimg[3];
}
}
</SCRIPT>
</head>
<body onLoad="look();">
<br>
<div id="cont">
<br>
<div style="float:left;"><a id="pge1" href="#" target="_blank">
<img src="vide.gif" id="mypic1" class="img"></a><div id="scr1"></div></div>
<div style="float:left;"><a id="pge2" href="#" target="_blank">
<img src="vide.gif" id="mypic2" class="img"></a><div id="scr2"></div></div>
<div style="float:left;"><a id="pge3" href="#" target="_blank">
<img src="vide.gif" id="mypic3" class="img"></a><div id="scr3"></div></div>
<div style="float:left;"><a id="pge4" href="#" target="_blank">
<img src="vide.gif" id="mypic4" class="img"></a><div id="scr4"></div></div>
<!-- lien pour recharger les 4 images -->
<a href="#" onclick="look();return false;">look</a><br><br>
</div>
</BODY>
</HTML>
Evidemment j'aurais pu afficher en faisant une boucle sur un document.write (mais perso , j'aime pas les document.write [8)] )
si questions ne pas hesiter ...
++
L.
re ,
erreur :
<SCRIPT LANGUAGE="JavaScript">
*/ >>> ICI mettre : /*
++
L.
je te remercie
je vais essayé tout ça dans la journée
re à tous ,
modification/simplification :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Page Web</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<STYLE type=text/css>
BODY{
text-align:center;background-color: aliceblue;margin:0px;
}
#cont{
width:450px; border:1px solid blue; margin-left:auto; margin-right:auto;
}
.img{
width:100px; height:70px; margin-left:10px; border:0px;
}
</STYLE>
<SCRIPT LANGUAGE="JavaScript">
/*
Les images sont nommées de 1.jpg à 22.jpg , elles sont placées dans le sous-repertoire "photos".
les liens renvoient sur une page "_blank" qui affiche les images en taille réelle.
Pour afficher une page.htm placée dans le sous-dossier pages : href = 'pages/'+ numimg[j] +'.htm';
Ici ce sont les mêmes images qui servent en onglets et taille réelle.(à vous de modifier)
*/
var nbimage= 22;
numimg = new Array()
function look()
{
for (var i = 1; i < 5; i++)
{
numimg[i]= Math.round(Math.random()*(nbimage-1)+1);
for (var j = 0; j < i; j++)
if (numimg[i] == numimg[j]) // teste (si identique , refait le tirage)
{
numimg[i]= Math.round(Math.random()*(nbimage-1)+1);
j = -1;
}
document.getElementById('mypic'+[i]).src= 'photos/'+ numimg[j] +'.jpg';
document.getElementById('pge'+[i]).href= 'photos/'+ numimg[j] +'.jpg';
document.getElementById('scr'+[i]).innerHTML = numimg[j];
}
}
</SCRIPT>
</head>
<body onLoad="look();">
<br>
<div id="cont">
<br>
<div style="float:left;"><a id="pge1" href="#" target="_blank">
<img src="vide.gif" id="mypic1" class="img"></a><div id="scr1"></div></div>
<div style="float:left;"><a id="pge2" href="#" target="_blank">
<img src="vide.gif" id="mypic2" class="img"></a><div id="scr2"></div></div>
<div style="float:left;"><a id="pge3" href="#" target="_blank">
<img src="vide.gif" id="mypic3" class="img"></a><div id="scr3"></div></div>
<div style="float:left;"><a id="pge4" href="#" target="_blank">
<img src="vide.gif" id="mypic4" class="img"></a><div id="scr4"></div></div>
<!-- lien pour recharger les 4 images -->
<a href="#" onclick="look();return false;">Autre tirage</a><br>
</div>
</BODY>
</HTML>
merci pour vos critiques , ameliorations , modifications ...
++
L.
Bonjour,
Recherchant à réaliser un tirage aléatoire de tarot mais débutant même pas premier niveau sous javascript, je me suis arrêté sur votre script.
Je souhaite réaliser deux tirages :
- le premier serait un tirage de 3 cartes, vue de dos avec une indication de thème pour chacune des 3 cartes (Amour, humeur et travail) et un titre décrivant le tarot. Je clique sur chacune des 3 cartes, elles se retournent (aléatoire), je clique sur un onglet en dessous (onglet : votre réponse) ; Et ici nous avons le visuel des 3 cartes avec un texte donnant l’interprétation des cartes.
Questions : outre l’écriture du code…comment lier les images et le texte ? faut-il un tableau ? comment faire ?
- pour le second tirage, ce serait un tirage d’une seule carte avec là aussi un titre décrivant le tarot. On voit une quinzaine de carte alignées et se chevauchant de dos avec un texte au milieu « cliquez ici » sur un fond avec une photo.
- On clique et une carte apparaît retournée avec donc l’interprétation texte
Même questions que ci-dessus, je peux vous monter des visuels qui seront peut-être plus parlant.
Merci pour votre éclairage.
par morerik,
Bonjour,
le plus gros du traitement est déjà décrit au dessus, les modifs concernent les 3 possibilités (amour,humeur,travail) qui sont des sous catégories possédant chacune leurs image et texte qui peuvent être numérotées pour les images , les textes pouvant être stockées dans des balises div qui sont affichées ou non. A+
par sprayart,
Re bonjour,
je continu mes essais...
j'ai créé sur mon bureau dossier nomé "photos", s'y trouvent les 22 cartes nomées 1.jpg, 2.jpg jusqu 22.jpg...
j'ai ensuite noté ceci dans le script :
........... height:100px; margin-left:10px; border:0px;
}</style><SCRIPT LANGUAGE="JavaScript">
/*
Les images sont nommées de 1.jpg à 22.jpg , elles sont placées dans le sous-repertoire "photos".
les liens renvoient sur une page "_blank" qui affiche les images en taille réelle.
Pour afficher une page.htm placée dans le sous-dossier pages : href = 'pages/'+ numimg[j] +'.htm';
Ici ce sont les mêmes images qui servent en onglets et taille réelle.(à vous de modifier)
*/
var nbimage= 22;
numimg = new Array()
numimg[0] = '1.jpg';
numimg[1] = '2.jpg';
numimg[2] = '3.jpg';
numimg[3] = '4.jpg';
numimg[4] = '5.jpg';
numimg[5] = '6.jpg';
numimg[6] = '7.jpg';
numimg[7] = '8.jpg';
numimg[8] = '9.jpg';
numimg[9] = '10.jpg';
numim.....etc
c'est toujours un echec !
par Stephhh,