Can anybody see what is causing the position shift at the end of this interaction?
The animated swirl is a background image (uses cover size) for an element with a Size interaction on it. It goes from width:0 to width:auto over 2 seconds. Basically I am happy with it apart fro the adjustment in position at the end. I can’t work out why though I suspect it has something to do with the background size attribute being ‘cover’.
The project is using the new upper desktop breakpoints and I’ve noticed that it works fine when the browser is between 1440 & 1600 pixels wide. It has the end adjustment in the largest breakpoint and it doesn’t play at all in the default desktop breakpoint of 992 - 1439 wide. I have only turned off the interactions for phone landscape and portrait; changing that doesn’t appear to have any effect.
Here’s the published page https://brand-counsel-testing-site.webflow.io/nomey-animated-swirl-test
Any help figuring it out will be greatly appreciated.
Here is my site Read-Only: https://preview.webflow.com/preview/brand-counsel-testing-site?utm_medium=preview_link&utm_source=designer&utm_content=brand-counsel-testing-site&preview=1164d06fa9ce2e9a95e9fafe8e3e4ae1&pageId=5f039cccb290a561ccbf06cf&mode=preview