How to Zoom in effects in hover? Copy the HTML / CSS structure and paste it into your editor.
Example:
HTML
<a class="zoom-in-hover" href="#">
<span class="group">
<img src="https://www.anthonycarbon.com/wp-content/plugins/wordpress-popular-posts/no_thumb.jpg" alt="Zoom in effects in hover" />
</span>
</a>
CSS
.zoom-in-hover {
overflow: hidden;
display: inline-block;
text-align: center;
}
.zoom-in-hover .group {
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.8s ease-in-out;
display: block;
overflow: hidden;
}
.zoom-in-hover:hover .group {
-ms-transform: scale(1.1);
-webkit-transform: scale(1.1);
transform: scale(1.1);
}