Agrandir une image au passage de la souris

**ishere11** · 29/12/2010, 20h45

Salut ,

je vaux faire apparaitre une image miniature en plus grand lorsque nous la survolons de la souris, et de masquer l’agrandissement lorsque la souris sort de l’image.

Merci pour l'aide.

**RomainVALERI** · 30/12/2010, 00h58

Tu as déjà quelque chose ? ^^

Un début de code ?
Une première recherche sur le web ? (genre sur des mots-clefs comme "diaporama", "vignettes", "zoomer sur une image", voire même "lightbox")
Un exemple du rendu final souhaité (vu ailleurs par exemple) ?

**ishere11** · 30/12/2010, 10h11

Envoyé par RomainVALERI

Tu as déjà quelque chose ? ^^

Un début de code ?
Une première recherche sur le web ? (genre sur des mots-clefs comme "diaporama", "vignettes", "zoomer sur une image", voire même "lightbox")
Un exemple du rendu final souhaité (vu ailleurs par exemple) ?

Merci pour ton reponse j'ai cherche mais rien je vaux faire comme google je peux agrandir image une fois je clique sur l'image une page s'affiche Exemple

**AbouZaid** · 30/12/2010, 13h13

bonjour,

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<A HREF="PageX.html" onmouseOver="actif();" onmouseOut="passif();"><IMG SRC="pic1.gif" NAME="bouton1"></A>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
<SCRIPT LANGUAGE="Javascript">
  <!-- ;
  function actif(){document.images["bouton1"].src="pic1.actif.gif"};
  function passif(){document.images["bouton1"].src="pic1.gif"};
  // -->
</SCRIPT>

cette méthode change carrement d'image, tu peux avoir une image originale et une autre qui est une image zoomée.

**ishere11** · 30/12/2010, 15h29

Envoyé par AbouZaid

bonjour,

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<A HREF="PageX.html" onmouseOver="actif();" onmouseOut="passif();"><IMG SRC="pic1.gif" NAME="bouton1"></A>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
<SCRIPT LANGUAGE="Javascript">
  <!-- ;
  function actif(){document.images["bouton1"].src="pic1.actif.gif"};
  function passif(){document.images["bouton1"].src="pic1.gif"};
  // -->
</SCRIPT>

cette méthode change carrement d'image, tu peux avoir une image originale et une autre qui est une image zoomée.

Merci pour ton reponse tu as utilise 2 images pic1.gif et pic1.actif.gif j'aime utuliser seulement une seul image pic1.gif zoomée come google

**SpaceFrog** · 30/12/2010, 15h47

y'a tellement de sources disponibles ...

perso je passerais par jquery avec un plugin
comme là par exemple http://www.sohtanaka.com/web-design/...es/image-zoom/
ou encore http://j-quary.blogspot.com/

**ishere11** · 30/12/2010, 16h32

Envoyé par SpaceFrog

y'a tellement de sources disponibles ...

perso je passerais par jquery avec un plugin
comme là par exemple http://www.sohtanaka.com/web-design/...es/image-zoom/
ou encore http://j-quary.blogspot.com/

Merci mais comment je peux le faire

**SpaceFrog** · 30/12/2010, 16h40

en lisant les conseils de mise en oeuvre sur les liens donnés .

**ishere11** · 30/12/2010, 16h57

Envoyé par SpaceFrog

en lisant les conseils de mise en oeuvre sur les liens donnés .

je comprend rien tu peux m'expliquer.

j'utilise ce Lien
Mais un erreur

**RomainVALERI** · 30/12/2010, 17h05

Envoyé par ishere11

je comprend rien tu peux m'expliquer

Après 20 minutes d'initiation à la soudure, on n'attaque pas la construction d'une réplique du grand pont de San Francisco...

Il va falloir choisir :

- lire et bosser un peu les cours et tutoriels des technologies que tu emploies (ce qui demande un peu de temps mais qui te donnera une bien meilleure compréhension de ce que tu fais)

OU

- te contenter de choses simples et prêtes à l'emploi conçues pour les non-spécialistes (ce qui n'a rien de déshonorant, on ne peut pas tous avoir toutes les spécialités ^^)