[Webmstring] Une belle galerie
Résolu
Bonjour,
Sur mon site, je présente des images présentées dans un premier temps en ligne et j'aimerai faire en sorte que, lorsque le visiteur passe la souris sur une de ces images, celle-ci s'agrandisse un poil, histoire d'avoir un aperçu rapide et puis une fois qu'on clique dessus, que tout le reste se fonce un peu et que l'image apparaisse en grand.
Je vois ça sur pas mal de site de vente en ligne notamment et je me dis que ça ne doit pas être si compliqué que ça. Je ne demande pas la solution toute mâchée, simplement une piste à explorer, un mot-clé à taper, quelque chose comme ça, si jamais quelqu'un s'est déjà posé la question.
D'avance, merci.
Sur mon site, je présente des images présentées dans un premier temps en ligne et j'aimerai faire en sorte que, lorsque le visiteur passe la souris sur une de ces images, celle-ci s'agrandisse un poil, histoire d'avoir un aperçu rapide et puis une fois qu'on clique dessus, que tout le reste se fonce un peu et que l'image apparaisse en grand.
Je vois ça sur pas mal de site de vente en ligne notamment et je me dis que ça ne doit pas être si compliqué que ça. Je ne demande pas la solution toute mâchée, simplement une piste à explorer, un mot-clé à taper, quelque chose comme ça, si jamais quelqu'un s'est déjà posé la question.
D'avance, merci.
4 réponses
-
dans head :
<script type="text/javascript"> function taille(dom,x,y) { dom.setAttribute("width",x+"px"); dom.setAttribute("height",y+"px"); } </script>
dans body :<img src="image.png" width="30px" height="20px" onmouseover="taille(this,60,40)" onmouseout="taille(this,30,20)" />
J'ai pas testé, et le code peut être améliorer.
Peut-être que ça marche pas sur internet explorer.
___/\_canarder_/\___
Le Renard qui règne sur le WEB : Firefox -
Il faut du javascript pour cela il me semble :) je ne saurais dire plus
-
Hum, j'avais effectivement pensé qu'il me faudrait du Javascript, après j'aurai espéré avoir une piste ou deux à explorer, mais merci tout de même Mikmuk d'avoir confirmé ce que je pensais. =)
-
Il y a un moyen juste en CSS en fait, mais toutes les images doivent avoir la même taille
img.small{ width:30px; height:20px; } img.small:hover{ width:300px; height:200px; }
<img src="http://monsite.com/myImg.png" alt="C'est ma super image !" class="small" />
___/\_canarder_/\___
Le Renard qui règne sur le WEB : Firefox
