Image zoom test
Great Design - Change Background Image on Hover in Elementor

With ‘magnifier’ class

Great Design - Change Background Image on Hover in Elementor

Without ‘magnifier’ class

Great Design - Change Background Image on Hover in Elementor

With ‘magnifier’ class

adapt this codepen, to work automatically with the images above, that have the CSS class name ‘magnifier’.

https://codepen.io/sitestudioapp/pen/Gozln

You will need to use DOM changes, adding the class name (‘magnify’) to the .elementor-image elements that are child of .magnifier div(s), and appending  a new child div (‘large’) to these .elementor-image . Might also need to add the class ‘small’ to the img .

Goal is that, by only giving a class name to the image, they will automatically have this magnifier. I want the code for that.

Important : Watch this video for more specific instuctions please! 

Add Your Heading Text Here

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Great Design - Change Background Image on Hover in Elementor
Great Design - Change Background Image on Hover in Elementor

Add Your Heading Text Here

Great Design - Change Background Image on Hover in Elementor

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.