Menu

Post image 1
Post image 2
Post image 3
Post image 4
Post image 5
1 / 5
0

How to Add Zoom Effect to Image Background on Elementor Container (Custom CSS)

DEV Community·Aliko Sunawang·26 days ago
#K7yyr6M6
Reading 0:00
15s threshold

Table of Contents The Method The Code Implementation Implementing the Code in Elementor Prebuilt Templates Elementor allows you to set an image as a background of a container. Be it on the normal state or on a hover state. However, after digging deeper, there is one super annoying thing: you can't set an animation effect on hover state. Even as simple as a zoom effect. This makes your design look soulless. Well, there is a built-in setting option on the editor to set the transition duration but it doesn't work on image background. I found a method that completely works in case you want to add a little animation to the image background on a container, via custom CSS. The Method As I said, Elementor has a built-in setting option to add an image background on both the normal state and hover state but the option to add a hover effect is missing. Of course, you can use custom CSS to apply the zoom effect on a container manually.…

Continue reading — create a free account

Join HashtagPLUS to read full articles, follow hashtags, vote, and join the conversation.

Read More