Javascript : un lien pour afficher une image parmi une liste d'images

Marsh Posté le 19-06-2002 à 13:02:37

sur le site sur lequel je bosse, il y a une zone où est affichée une image.

Je voudrais faire deux choses :

- qu'a chaque rechargement de la page, une image "au pif" soit affichée (mais ça, j'ai bon espoir d'y arriver tout seul....Quoique...)
- qu'à chaque fois que l'utilisateur clique sur un lien, l'image suivant celle qu est affichée, dans une liste d'images définie, remplace l'image courante (sans recharger la page)

Comment on fait ça??

Reply

Marsh Posté le 19-06-2002 à 13:02:37

Reply

Marsh Posté le 19-06-2002 à 13:11:37

pour l'image aléatoire, tu mets les noms dans un tableau, et tu generes un nombre aleatoire entre 0 et taille du tableau - 1 qui te donnera l'indice de l'image a afficher

pour afficher une nouvelle image sans recharger la page, tu mets ta balise <img> dans un div, et quand l'utilisateur cliques sur ton lien, tu changes le contenu du div.innerHTML

Reply

Marsh Posté le 19-06-2002 à 13:47:27

Bah, en fait, j'ai fait autrement!!

j'ai fait avec des document.image.src=ma_fonction_qui_me_donne_le_nom_de_limage()

et ça marche nickel!

Reply

Marsh Posté le 19-06-2002 à 14:08:05

Ouais, enfin, ça marche sous IE, sous Galeon (Mozilla 1.0), mais pas sous Netscape 4.78...Une idée, qqun??

Reply

Marsh Posté le 19-06-2002 à 14:24:45

gfive a écrit a écrit :

Ouais, enfin, ça marche sous IE, sous Galeon (Mozilla 1.0), mais pas sous Netscape 4.78...Une idée, qqun??

ton image s'appelle bien image?(hahem)
<img blabal name="image"> ? paske sinon je vois pas, ça devrait fct sous ns, a moins que ta fct marche pas sous ns?) t'as verifié avec un alert je suppose...

Reply

Marsh Posté le 19-06-2002 à 14:26:10

et au fait
tes images (dont ta fct retourne le nom), sont des objets images ou des url?
si ta fonction retourne le NOM d'un objet image tu dois faire un truc du style document.image.src=eval(tafonction()+'.src';
je crois..

Reply

Marsh Posté le 19-06-2002 à 14:42:31

Le code qui ajoute l'image :

Code :

<td width="99" colspan="2"><img name=smiley width="99" border="0"></td>

Le code JS :

Code :

<SCRIPT language="Javascript">
<!--
<!--hide this script from non-javascript-enabled browsers
setCurrentImage();
document.smiley.src=getNextImage();
// stop hiding -->
</SCRIPT>

et la fonction getNextImage :

Code :

function getNextImage() {
current = current+1;
if (current > picz.length-1)
{ current = 0 }
return picz[current];
}

où current est un entier, et picz mon tableau d'images.

Reply

Marsh Posté le 19-06-2002 à 14:44:24

essaie de remplacer

return picz[current];

par

return picz[current].src;

OU

document.smiley.src=getNextImage();

par

document.smiley=getNextImage();

Message édité par --greg-- le 19-06-2002 à 14:45:05

Reply

Marsh Posté le 19-06-2002 à 16:45:19

nan, mais dans le tableau, c'est pas des objets image, il me semble :

Code :

var picz = Array(
"/images/Acronyms/001.gif",
"/images/Acronyms/002.gif",
.....
);

Reply

Marsh Posté le 19-06-2002 à 17:10:57

gfive a écrit a écrit :

nan, mais dans le tableau, c'est pas des objets image, il me semble :

Code :

var picz = Array(
"/images/Acronyms/001.gif",
"/images/Acronyms/002.gif",
.....
);

ha, comme ça
tu les preloades pas tes images alors?
attends une seconde, si j'ai ça ici, je te trouve un truc

Reply

Marsh Posté le 19-06-2002 à 17:10:57

Reply

Marsh Posté le 19-06-2002 à 17:13:48

nan, je les préloades pas, et sous NS 4.7X, j'ai une image manquante affichée, et si je clique-droit dessus et que je demande l'afichage de l'image, ça marche!

Reply

Marsh Posté le 19-06-2002 à 17:15:02

bon voila ce que je fais moi et ça marche sur ns4 et tout
edit: bref le code que j'avais pasté sert à rien mais tu devrais pê essayer ceci:

Code :

function getNextImage() {
current = current+1;
if (current > picz.length-1)
{ current = 0 }
img = new Image();
img.src = picz[current];
return img;
}

Message édité par --greg-- le 19-06-2002 à 18:43:40

Reply

Marsh Posté le 19-06-2002 à 18:44:15

ha tiens, les edit ça fait pas up
up alors :bounce:

Reply

Marsh Posté le 20-06-2002 à 08:43:23

Et ensuite, tu l'utilises comment :

Comme ça :

document.smiley.src=getNextImage().src;

ou comme ça :

document.smiley=getNextImage();

Reply

Marsh Posté le 20-06-2002 à 23:23:22

gfive a écrit a écrit :

Et ensuite, tu l'utilises comment :

Comme ça :

document.smiley.src=getNextImage().src;

ou comme ça :

document.smiley=getNextImage();

les 2 peuvent marcher, ché pas faut essayer

---------------
#19b | Mardi 18 Février 2003 - nous fêtons les Bernadette | contre le fleur icq!

Reply

Javascript : un lien pour afficher une image parmi une liste d'images

Sujets relatifs:

Leave a Replay