Zoom in Effect
Create you own hover zoom effect
To add a Hover Zoom-In effect to a Divi image module, there are two steps to apply.
First of all, add an additional CSS class name to the module, for example:
zoom-in
Next, add the following code to the Custom CSS field under Dashboard / Theme Options / General Settings:
.zoom-in.et_pb_image:hover img, .zoom-in .et_pb_image_wrap:hover img, .zoom-in a:hover img { transform: scale(1.2); transition: all 300ms 0s ease; } .zoom-in, .zoom-in a { overflow: hidden; } .zoom-in.et_pb_image img, .zoom-in .et_pb_image_wrap img, .zoom-in a img { transition: all 1s 0s ease; }
Feel free to change the property values of the the animation code.
Simple yet effective.
Nice!!!!!!.