Unknown Scaling of Picture - Why oh Why!

Hi All,

Need some help - as I continue to bang my head against the desk! I’ve put together a Loom for anyone who wants to help (I love this community).

In a nutshell - I am having a hard time figuring out why the Chameleon picture scales at the end of its animation, where the adjacent image does not.

Can someone please please help me! I’m not adverse to hiring someone to finish off some animations on this section for me if they are good enough - when I do it, it’s like watching a baby giraffe walk for the first time!

Many thanks all.


Here is my site Read-Only: ** https://preview.webflow.com/preview/octaviazydel?utm_medium=preview_link&utm_source=designer&utm_content=octaviazydel&preview=832e2363325183214e191d856b032463&workflow=preview **

Hi @madfishbiscuit, thanks for your post.

This behavior is probably happening due to the hi-res image, as the div block where the background image is used is made wider from 25% to 50%, div area is increased, more image is shown and appears zoomed in when the image container is set to 50% vs 25% which is constraining the background image and part of the image appears cut off at page load.

I would try setting the background image to use hidpi checkbox and to set the width of the image to 1000px like so:

Shared with CloudApp

After I do that, the image is constrained to 1000px and the zooming effect stops, because at 25%, the image is constrained to 1000px and that value does not change as the div having background width changes.

I hope this helps

The main man that is @cyberdave nailing it for me immediately. Thank you so much! Genuinely appreciate your help here. Mean a lot!

Have a great weekend.

1 Like

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.