Issue with Page load animations in Chrome

Hi folks, I am new (hello!) I very much hope this is in the correct section.

Context: My first Webflow site. My first post. Very much a newb. I am sure that my site has not been constructed in the most efficient way, it’s been built as I learn and may be a bit of a mess internally, regardless of its simple exterior (please be kind and patient, ha!). I’ve been able to get past most issues, but this one (below) has stumped me so far.

Goal: To add page load animations to some pages. I have started adding page load animations to my pages. Simple ones; The bulk of the page moves up + opacity-fades in (classic). I did feel like I understood how to do this and so far haven’t found any extra bits that I may have previously missed - but something is wrong.

Problem: I have noticed that when a page with the page load animation applied is refreshed in Chrome, everything affected unexpectedly shifts upwards. The next time the page is refreshed it shifts up some more. This happens each time (it keeps going up) until some limit is reached (on one page it is after 3 refreshes, on another it is approx 7). When I travel to the page, it works fine, it is when I stay one the page and refresh over and over.

This issue doesn’t seem to happen in Safari. I can’t figure out if it is something I have done, or an issue with Chrome compatibility specifically, or a combination of the two.


The two pages that are affected presently are ‘About’ and ‘Projects-Typography’

Read only links:
About
Projects-Typography

Live:
About
Projects-typography
Password: Magnesium
(they are already live, but password protected presently)


Any help would be greatly appreciated! :slight_smile: