Jump to content
GreenSock

MadG

ScrollTrigger side scrolling super jumpy in Safari

Go to solution Solved by MadG,

Recommended Posts

Hey all. This problem isn't something I can really recreate in a Codepen, it's more of a general "why is this behavior happening and what can I do about it" question. I built this page using ScrollTrigger according to the official Codepen on horizontal scrolling sections. It's working totally fine and smoothly for me in Chrome and Firefox, but in Safari it's insanely jumpy. It scrolls halfway down the page vertically then snaps back into its correct place. Has anyone else been experiencing these issues with Safari, and is there anything I can tune in the ScrollTrigger settings to try and smooth it out a bit? 

Link to comment
Share on other sites

Without a minimal demo this is tough to debug, but I'm guessing it's due to having a ScrollTrigger pinned element in inside a fixed position div (I'm quite certain the official CodePen doesn't have this). In addition to that, you also have some native side scroll mixed in there, so that could be throwing things off.

  • Like 1
Link to comment
Share on other sites

  • Solution

@elegantseagulls thanks for your input here. After doing some research last night, a lot of the performance hit was due to having CSS filters on all the image elements on the page. Didn't realize Safari doesn't like filter. Changing those to box shadow made a night and day difference on local. I will definitely look into your suggestions though, thank you!

  • Like 1
Link to comment
Share on other sites

@elegantseagulls do you mind expanding a bit on the native side scroll mixed in? Where are you seeing that? 

Link to comment
Share on other sites

56 minutes ago, MadG said:

do you mind expanding a bit on the native side scroll mixed in

Not seeing it today!

Link to comment
Share on other sites

@elegantseagulls perfect. I removed the pin-in-fixed because I realized I didn't need the fixed div on that specific page, so that may have removed it. Thanks for your help!

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×