Effet zoom en CSS

Iceland 1979445 1920

Texte

 

<p style="text-align: center;"><img alt="Iceland 1979445 1920" class="img-center" height="auto" src="https://www.test-thomas.fr/medias/images/iceland-1979445-1920.jpg" /></p>

<p>Texte</p>

<p style="text-align: center;">&nbsp;</p>
<style>
    .img-center{
        zoom: 20%;
    }
    .img-center:hover, p:hover{
        zoom: 100%;
        transition: 1s;
    }
</style>

<style>.zoom {
  padding: 50px;
  background-color: green;
  transition: transform .2s;
  width: 200px;
  height: 200px;
  margin: 0 auto;
}

.zoom:hover {
  -ms-transform: scale(1.5); /* IE 9 */
  -webkit-transform: scale(1.5); /* Safari 3-8 */
  transform: scale(1.5); 
}
</style>
<div class="zoom"></div>

Lantern 3043042 1280

.img-scale:hover{ transform: scale(1.1); }

Questions / Réponses

Aucune question. Soyez le premier à poser une question.
Anti-spam
 
  • Aucune note. Soyez le premier à attribuer une note !

Commentaires