Expanding div, reveal fullscreen image

Design help Animations & Interactions
1

Hi, looking for a steer in the right direction.

This feels like it should be easy… but is it possible to have a fullscreen image contained in a smaller div, and an interaction to animate the mask / div expanding to fullscreen without scaling the image?

Have tried with images, background images, fixed, but the image always scales…

https://preview.webflow.com/preview/anthony-noyce-design?utm_medium=preview_link&utm_source=designer&utm_content=anthony-noyce-design&preview=a0b8e058502acecfe183cc580838366d&workflow=preview

Here is my public share link: LINK
(how to access public share link)

2

Hey @AntNoyce !

You can play with the Size property instead of the Scale in the animation tab.
Also I positioned my image at the center with flexbox so that it is not anchored to one of the sides.
CleanShot 2022-05-06 at 09.59.17
i

Let me know if it was the intended result ! Have a nice day !

3

Thanks Jean-Philippe, i knew it should be simple, let me try that out, now you say ‘size’ its obvious