ScrollTrigger glitchy behaviour only on Safari

[thunder80 0 Likes (Newbie)]

Hi, I was creating a simplistic horizontal sliding animation on vertical scroll. Everything seems to be solid on Chrome and Firefox but there is some glitchy behaviour on Safari. My observations:

1. When going from first image to second image the first time there is an x-axis glitch.

2. On scrolling up fast there is some kind of jumping on y-axis.

 

Here is a video to explain the glitch.

https://www.dropbox.com/s/062qt3l9j2mc8lb/gsap-safari-x.mov?dl=0

 

Thanks for your help!!!

 

 

See the Pen XWeLGEw by thunder80 (@thunder80) on CodePen

[OSUblake 18,475 Likes (Superhero)]

Hi thunder,

 

Your video doesn't seem to be valid and I don't see any problems with your demo, so I'm not sure what to suggest. 

 

For y-axis jumps, sometimes pinning can mess up because scrolling on a different thread than the JavaScript, so the only way to fix that is to use some sort of smooth scrolling.

 

 

[thunder80 0 Likes (Newbie)]

Hi @OSUblake,

 

I will try out smooth scrolling today as you mentioned. 

 

Regarding the x-axis issue,  you can find it at around 0:04 of the video(https://www.dropbox.com/s/062qt3l9j2mc8lb/gsap-safari-x.mov?dl=0). I am attaching a screenshot. There is a white portion on the right side of the page when you scroll the first image first time.