First this is only designed in mobile, so jump to that breakpoint to start.
I have a wide image that i want to have in cover to start so you only see the middle few hundred pixels as shown.
As you scroll I want to basically scale down the image to end up like a contain image, so that you can see the entire thing.
I have the containers working as I want them for the scrolling (I think) but maybe there is a better way to do this?
I dont think you can have an interaction that changes from cover to contain so I was changing the height of the container to go from a portrait length of 100VH to about 40VH to accommodate the different aspect ratios.
I just cant get the image to scale down in a meaningful way, it just ends up being too small and there is white space.
How can i start with an image that is too wide for my screen and just scale it down so that it fits in the container at the end?