In de snelle tip van vandaag maken we een dynamisch ‘zoom bij hover’-effect dat afbeeldingen op je pagina’s een interactieve touch geeft. Met de onderstaande CSS schalen je afbeeldingen elegant op wanneer de muis erover beweegt. Het effect vraagt weinig code en is een mooie manier om de visuele aantrekkingskracht van je site te vergroten en bezoekers te betrekken.
DEMO: zoomen bij hover
HTML
<img class="zoom-in" src="YOUR-IMAGE-PATH"/>
CSS
.zoom-in { transition:transform .2s; }
.zoom-in:hover { transform: scale(1.2); }