Image zoom au passage de la souris 😁🔍

PHOTO EMBED

Sat Feb 27 2021 03:34:09 GMT+0000 (Coordinated Universal Time)

Saved by @Laura #html #css

<div class=zoom>
 <div class=image>
 <img src="http://isarta.com/infos/wp-content/uploads/2017/05/couleurs_Fotolia_118879445_S-1.jpg" alt=Text de remplacement width="500" height=""/>
 </div>
</div>

<style>
.zoom {
width: 320px;
height: 240px;
}
.image {
width: 100%;
height: 100%;
}
.image img {
/* La transition s'applique à la fois sur la largeur et la hauteur, avec une durée d'une seconde. */
-webkit-transition: all 1s ease; /* Safari et Chrome */
-moz-transition: all 1s ease; /* Firefox */
-ms-transition: all 1s ease; /* Internet Explorer 9 */
-o-transition: all 1s ease; /* Opera */
transition: all 1s ease;
}
.image:hover img {
/* L'image est grossie de 25% */
-webkit-transform:scale(1.25); /* Safari et Chrome */
-moz-transform:scale(1.25); /* Firefox */
-ms-transform:scale(1.25); /* Internet Explorer 9 */
-o-transform:scale(1.25); /* Opera */
transform:scale(1.25);
}
</style>
content_copyCOPY

https://codelauradima.now.site/home