I would like to make a looping animation where the background image slightly zooms in and then zooms out.
I have created a scale animation in the interactions section, set the class to body and chosen “Only parents with this class” since the body has the background image but it doesnt work. Would appreciate if someone could please look into this and see whats wrong or is it even possible to create a looping zoom in/out animation to the background image?
Instead of setting an interaction on the Body itself, I would create a div inside the Body with the class Background Image and set it’s position to absolute with a Z-Index of -1 so it sits in the background.
Inside of this div add an Image with Width and Height set to 100% and Fit set to cover.
Then for the interaction I would target the Background Image element, make sure you set the first Scale as the initial state, set the second to however much you want it to zoom in by, and then set the third back to the same settings as the first but this time keeping the initial state checkbox unchecked.
Playing this interaction on a loop should work.
