On iOS Safari (iPhone 12 Pro Max) there is a bug where the animation timeline view block is incorrect, so the animation is at 100% briefly when it is coming into view.
You can see this happening at the bottom of the page on the demo page https://scroll-driven-animations.style/ if you slowly scroll down the page on iPhone.
I believe it's an incorrect number for VH being used, based on the address bar changing height to give more screen space.
Touched on with dvh etc here https://webkit.org/blog/12445/new-webkit-features-in-safari-15-4/
Strangely doesn't seem to be an issue on iPadOS, but the address bar is at the top rather than the bottom in that instance.
I'm using the non-module script tag version if that makes a difference.
On iOS Safari (iPhone 12 Pro Max) there is a bug where the animation timeline view block is incorrect, so the animation is at 100% briefly when it is coming into view.
You can see this happening at the bottom of the page on the demo page https://scroll-driven-animations.style/ if you slowly scroll down the page on iPhone.
I believe it's an incorrect number for VH being used, based on the address bar changing height to give more screen space.
Touched on with dvh etc here https://webkit.org/blog/12445/new-webkit-features-in-safari-15-4/
Strangely doesn't seem to be an issue on iPadOS, but the address bar is at the top rather than the bottom in that instance.
I'm using the non-module script tag version if that makes a difference.