Hi team,
I have an animation which tweens in from the top of the screen on scroll using ScrollTrigger. The issue I have found is if I scroll part way down the page, and refresh the screen, the page loads after the trigger and so the animation is already in its completed state (which it should be) but when I scroll back up to the top of the page past the trigger it doesn't reverse the animation and the element is stuck in its completed state rather than be reverted to where it started from.
Couldn't replicate the issue on codepen since you can't refresh the page part way down but this is how I have setup the animation: https://codepen.io/josh-kiwi/pen/JjGOJZo
If you were to reload the page half way down, the pink box would be visible, but after scrolling to the top it would not hide itself.
Thanks!