Html - Javascript Rollover

Par Athanael le 31/10/2002 à 11:07:52 (#2447266)

Encore une petite question sur le javascript il me semble, je ne trouve plus le code pour faire que, lorsque la souris passe sur une image cela change une autre image, pour etre clair je voudrais qu'en passant la souris sur une image A, cela fasse changer l'image B.
Voilà merci de votre aide :).

Par Nikkau le 31/10/2002 à 11:17:42 (#2447352)

La flemme de recopier le script donc j'te donne une URL qui, de tête existe, www.toutjavascript.com .

Par Athanael le 31/10/2002 à 11:29:20 (#2447441)

Ah merci beaucoup, je ne connaissais pas ce site !

Par Erkethan le 31/10/2002 à 11:47:52 (#2447592)

On prend imgbase comme image de base et newimg comme image de survol. x est la position de l'image (donc 0 si c'est la premiere de la page, 1 si c'est la deuxième, etc ... )



Tu peux aussi precharger les images, pour qu'elles soitent mis en cache avant. par ex :


imagein = new Image();
imagein.src = "newimg";
imageout = new Image();
imageout.src = "imgbase";
function change() {document.images[x].src = (imagein.src);}
function recal() {document.images[x].src = (imageout.src);}




:)

Par Athanael le 31/10/2002 à 13:23:53 (#2448481)

Merci beaucouuuuuuuuuup ! :).

Par Lumina le 31/10/2002 à 14:19:20 (#2448968)

Tu peux aussi essayer de regarder les sources de cette page pour voir ce que ca donne en pratique :
http://septentrion.coeurlumiere.com/menu.htm

(si les images n'apparaissent pas, c'est parce que le site est a l'abandon depuis longtemps, mais les scripts sont toujours valides je crois)

Par Aron le 31/10/2002 à 14:24:51 (#2449019)

Tiens, en passant, j'ai un rollover sur mon site mais il est "lent". Il y a un temps de latence très visible la première fois que je passe la souris dessus. Faut il que je précharge les images, qui font entre 3 et 6k chacune ? J'ai eu la flemme de le faire. :)

Par Lumina le 31/10/2002 à 14:58:12 (#2449294)

J'avais eu un probleme de lenteur avec les rollovers, mais je l'avais corrige en remplacant l'adresse relative des images (../ubb/bbtitle.gif) par une adresse absolue (http://forums.jeuxonline.info/ubb/bbtitle.gif).

Par Erkethan le 31/10/2002 à 15:04:58 (#2449345)

il faut préchargé, bien sur ;)

Sinon, l'image n'est rapatrié qu'au moment du survol. Et il ne fait le remplacement qu'une fois l'image téléchargée. Si tu pré-load, ca marche mieux ;)

Par Athanael le 31/10/2002 à 15:30:30 (#2449557)

J'ai encore une petite question dérivée de la première, voilà, en faisant un rollover sur une première image je voudrai que cela entraîne le rollover d'une autre alors comment faut il "ecrire" tout ca ? :)

Merci ! :merci:

Par Novae Galliano le 31/10/2002 à 15:33:20 (#2449590)

sinon il y a ..

Par Novae Galliano le 31/10/2002 à 15:37:13 (#2449619)

J'ai encore une petite question dérivée de la première, voilà, en faisant un rollover sur une première image je voudrai que cela entraîne le rollover d'une autre alors comment faut il "ecrire" tout ca ?

L'image B remplace la A et la D remplace la C

par contre il faudra faire un

Par Erkethan le 31/10/2002 à 15:39:14 (#2449633)

si tu l'as préchargé, t'as juste a mettre les lignes de changement en plus dans les fonctions change() et recall() ;)

Par Aron le 31/10/2002 à 15:43:04 (#2449674)

Provient du message de Athanael
J'ai encore une petite question dérivée de la première, voilà, en faisant un rollover sur une première image je voudrai que cela entraîne le rollover d'une autre alors comment faut il "ecrire" tout ca ? :)

Merci ! :merci:

Le principe du rollover c'est de changer l'adresse de l'image à montrer quand tu passes dessus. Mais tu peux changer l'adresse d'autres images en même temps.

Imagine que tu aies deux images sur la page, et que tu veux changer les deux images quand tu passes sur la première. si on reprend le script plus haut ça donne :


...



Ou quelque chose dans ce genre là ;)

Par Orlandu le 31/10/2002 à 18:05:04 (#2450920)

Merci beaucoup pour ces réponses, je devrais pouvoir m'en sortir avec tout cela ! :).

Par Orlandu le 2/11/2002 à 13:52:11 (#2461757)

D'ailleurs j'aimerai vous montrer ce que j'ai fait grâce à votre aide si cela vous interesse de voir :
ICHI.

Encore merci :).