Page 1 sur 1

Javascript et images

MessagePublié: Mer Avr 13, 2005 13:51
par Invité
Je suis à la recherche d'un script permettant le roll over sur image déportée.
Exemple :
En passant la souris sur un texte ou une image, qu'à un autre emplacement une image soit changée.

Exemple si vous allez sur Estuaire 44 si vous passez la souris sur l'image celle-ci change, enfin normalement.
Ce que je cherche à faire c'est la même chose mais cette fois ci en passant la souris sur un des 3 boutons Galerie.

J'ai bien trouvé quelques javascripts mais ils me semblent très complexes.

8) 8) 8)

MessagePublié: Mer Avr 13, 2005 14:58
par Invité

MessagePublié: Mer Avr 13, 2005 15:31
par Invité
Merci Tetio, mais c'est déja ce qui existe actuellement. Ce que je souhaite faire c'est un roll over déporté.
Exemple :
En situation "neutre"
A est un bouton
B est une image située en dessous du bouton A

En situation "action"
Si la souris passe sur le bouton A
L'image B est remplacée par une image C

C'est ce genre d'action que je recherche :idea:

8) 8) 8)

MessagePublié: Mer Avr 13, 2005 15:39
par Invité
Ok, quand tu auras la solution (parce que là, je seiche), elle m'interesse bigrement :wink:

MessagePublié: Mer Avr 13, 2005 18:57
par tom (webmaster)

MessagePublié: Mer Avr 13, 2005 19:50
par Invité

MessagePublié: Mer Avr 13, 2005 20:54
par Invité

MessagePublié: Mer Avr 13, 2005 21:01
par Invité

MessagePublié: Jeu Avr 14, 2005 10:29
par Invité
Bon ben, je n'y arrive pas. Je vous mets la copie du script :
<script language="javascript">
<!--
Images/boutpate.gif = new Image;
logovitalpasta.gif.src = "grandeVitalpasta.gif";
Images/boutpuree.gif = new Image;
Images/boutpuree.gif.src = "DataImages/grandepuree.gif";
Images/boutriz.gif = new Image;
Images/boutriz.gif.src = "DataImages/grandeRiz.gif";
Images/boutsauceforest.gif = new Image;
Images/boutsauceforest.gif.src = "DataImages/grandeSauceVitalForestiere.gif";
Images/boutsaucetomabas.gif = new Image;
Images/boutsaucetomabas.gif.src = "dataImage/grandeVitalTomateB.gif;
//-->
</script>

Il faut bien remplacer "image1" par le vrai nom de l'image ? une petite précision : toutes les images bout.... .gif sont dans un tableau et l'image qui doit changer n'y est pas, elle est en dessous et s'appelle : logovitalpasta.gif. Ce que je veux, c'est en passant sur un bout quelque chose, logovitalpasta doit changer et montrer un "grandeVitalpasta.gif, enfin tout ce qui est en grande quelque chose.

Merci du coup de main, je sèche là ?

MessagePublié: Jeu Avr 14, 2005 12:14
par tom (webmaster)
Moi et le javascript.... ca fait 8

MessagePublié: Jeu Avr 14, 2005 12:39
par Invité
"DataImages" c'est le nom du répertoire ou se trouvent mes ressources pour le site Estuaire 44, il est normal que cela ne fonctionne pas chez toi.

Entre les balises <head> et </head> tu entre le script suivant en adaptant ce qui est en rouge a ton répertoire/image.xxx
------------------------------------------------------------------------------
<script language="javascript">
<!--
image1 = new Image;
image1.src = "DataImages/estuaire.jpg";
image2 = new Image;
image2.src = "DataImages/SB01.jpg";
image3 = new Image;
image3.src = "DataImages/PO01.jpg";
image4 = new Image;
image4.src = "DataImages/SN01.jpg";
//-->
</script>
et autant de fois image5, 6, 7 etc..
------------------------------------------------------------------------------

Entre les balises <body> et </body> dans la cellule ou se trouve le bouton Galerie 01 on demande a remplacer image1.src par image2.src au passage de la souris sur le bouton b_galerie01.gif
------------------------------------------------------------------------------
<td
style="height: 27px; width: 600px; text-align: center; vertical-align: middle;"
colspan="3" rowspan="1"><a href="DosGalerie01/index.html"
onmouseover="distance.src=image2.src"
onmouseout="distance.src=image1.src"><img
style="border: 0px solid ; width: 89px; height: 27px;" alt="Galeries"
title="Photos de Saint Br&eacute;vin" src="DataIcones/b_galerie01.gif"></a>
-------------------------------------------------------------------------------
Dans la cellule suivante c'est l'indication de l'image a afficher quand il n'y aucune action "mouse".
<td
style="text-align: center; vertical-align: middle; height: 167px; width: 600px;"
colspan="3" rowspan="1"><img
style="border: 0px solid ; width: 600px; height: 167px;"
src="DataImages/estuaire.jpg" name="distance" alt="><br>
</td>
--------------------------------------------------------------------------------
8) 8) 8)

MessagePublié: Jeu Avr 14, 2005 12:51
par Invité
wouha !! ben y du taf là ! merci Berham :wink:

MessagePublié: Jeu Avr 14, 2005 16:29
par Invité
je viens d'y passer l'après-midi !!! j'y renonce :cry: Merci quand même :wink: