Paul Yabsley

Ha fair enough, its quite subtle in the demo I admit. Its a lot worse on the actual working project. Just a bad developer 😂 cheers for the heads up, makes sense, I'll change it! Yeah I agree, seems like its an iOS issue. Thanks again for your help.

Hey thanks for checking. Unfortunately I don't have an ipad to test on. Only an iPhone. I've created a fork of the pen where the images are uncommented and this makes the choppiness more exaggerated in my testing. https://codepen.io/paulyabsley/pen/qBwoaVz?editors=0010 It also has will-change:transform; applied to the .word elements but that doesn't seem to resolve the issue. I've also tried setting ScrollTrigger.normalizeScroll(true) (currently commented out in the above pen) which does get rid of the choppiness but I'm not sure the side effects of that (disabling native scroll) are what we want. Seems a bit heavy handed. Very curious why it happens in iOS but not desktop browsers and (I'm told) not on Android devices. In the attached screen recording you can see the issue in the first flick scroll. In the second I scroll and stop and you can see the words transform smoothly. A frustrating bug for sure. Thanks again for your help. output.mp4

I have a timeline animation which transforms text in from offscreen. The timeline is scroll triggered. On iOS, during scroll the transform is choppy/stutters. Only seems to happen during scroll. I'm told by colleagues using android devices that it isn't happening there. Also the animation is smooth in desktop browsers during scroll. This is the codepen debug view https://cdpn.io/pen/debug/jORZZYj?authentication_hash=mWAoNBaVOzVr Any help would be massively appreciated.