Comment agrandir une image en survolant une image?

Question

Je veux montrer l'image de la vignette grande lorsque survolée dessus, similaire à celui de

http://www.freelayouts.com/websites/html-templates Aide Plz. Toute aide serait appréciée.

Answer 1

Qu'est-ce que vous avez besoin est un plugin infobulle. Il y en a plein. Consultez cette liste: https://cssauthor.com/jquery-css3-hover-effects/

Answer 2

Jetez un oeil à http://fancybox.net/blog

Fancybox est joli, utilise JQuery et est hautement configurable avec différents show/effets cacher. numéro 3 tutoriel sur cette page vous montre comment utiliser OnHover plutôt que Surclic

La page d'accueil http://fancybox.net/home montre quelques exemples de l'effet visuel

Answer 3

<img class="enlarge-onhover" src="img.jpg"> 

... 

And on the css: 

.enlarge-onhover { 
    width: 30px; 
    height: 30px; 
} 

.enlarge-onhover:hover { 
    width: 70px; 
    height: 70px; 
} 

Answer 4

<script> 
function bigImg(x) { 
    x.style.height = "64px"; 
    x.style.width = "64px"; 
} 

function normalImg(x) { 
    x.style.height = "32px"; 
    x.style.width = "32px"; 
} 
</script> 

<img onmouseover="bigImg(this)" onmouseout="normalImg(this)" border="0" src="smiley.gif" alt="Smiley" width="32" height="32"> 

La fonction bigImg() est déclenchée lorsque la souris de l'utilisateur sur l'image. Cette fonction agrandit l'image.

La fonction normalImg() est déclenchée lorsque le pointeur de la souris est sorti de l'image. Cette fonction définit la hauteur et la largeur de l'image à la normale.