En el consejo rápido de hoy vamos a crear un efecto dinámico de «zoom al pasar el ratón» que da un toque interactivo a las imágenes de tus páginas. Con el CSS que verás a continuación, las imágenes aumentan de escala con elegancia al pasar el puntero. Es un efecto de poco código y una forma estupenda de mejorar el atractivo visual del sitio y captar la atención de quienes lo visitan.
DEMO: zoom al pasar el ratón
HTML
<img class="zoom-in" src="YOUR-IMAGE-PATH"/>
CSS
.zoom-in { transition:transform .2s; }
.zoom-in:hover { transform: scale(1.2); }