Saltar al contenido

Zoom en la imagen dentro de div sin mover div

Solución:

Usar transform: scale

#container {
  display: inline-block;
  margin: 20px;
  border: 1px solid black;
  overflow: hidden;            /* clip the excess when child gets bigger than parent */
}
#container img {
  display: block;
  transition: transform .4s;   /* smoother zoom */
}
#container:hover img {
  transform: scale(1.3);
  transform-origin: 50% 50%;
}
<div id="container">
    <img id="image" src="http://placehold.it/150">
</div>

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *