Jump to content
Search Community

Issue with ScrollSmoother | iOS | safari - chrome - maybe others

Harold AO test
Moderator Tag

Recommended Posts

 

 

Hello Greensock. 

I had a weird issue with ScrollSmoother on my iPhone 12 (I tested on Safari and Chome) — c.f Video 1 (IMG_2495.MOV)


So I tried to active ScrollSmoother on mobile with smoothTouch : (whatever)

The issue was gone but a new one popped up (when we click/touch/tap the screen we are redirected to the top of the page) — c.f Video 2 (IMG_2496.MOV)

 

So my last solution was to wrap everything related to ScrollSmoother into a if statement : if !/Android|webOS|iPhone………../i.test(navigator.userAgent)

 

FYI: I also tested the 2 first issues on BrowserStack and there were no issues. 

Link to comment
Share on other sites

  • 1 month later...
13 hours ago, GreenSock said:

I believe this is fixed in the next release which you can preview at:

You may need to clear your cache. 

image.png.3ff1952aeae5a3acbd601589e82d8f52.png

Am I missing something ? (I'm still at 3.10.4)👀

Link to comment
Share on other sites

26 minutes ago, GreenSock said:

That's correct - the preview files I talked about above are NOT in the official downloads yet because they're not released yet. Those files are a work-in-progress. 

Got it ! Thanks for the update !

Link to comment
Share on other sites

  • 1 month later...
2 hours ago, Diego Gnoatto said:

i got the same issue on ios, any solution on this while we wait the release of 

ScrollSmoother 3.11.0 ?

@Diego Gnoatto I sent you the beta files - you're welcome to use those for now. Please let us know if it resolves things for you or if you notice anything else that looks odd. We're prepping the launch, so hopefully it won't be terribly much longer. Thanks for everyone's patience. 

Link to comment
Share on other sites

  • 1 year later...

Hello i have the same issue on saithia.oneupstudio.it 

 

ScrollTrigger 3.12.2

ScrollSmoother 3.12.2

 

all the animations are busted, testing from browser mobile mode it works perfectly. On devices  both safari and chrome everything is broken, jump, the pinned sections are random

 

 

Link to comment
Share on other sites

2 hours ago, AllenIVe said:

Hello i have the same issue on saithia.oneupstudio.it 

 

ScrollTrigger 3.12.2

ScrollSmoother 3.12.2

 

all the animations are busted, testing from browser mobile mode it works perfectly. On devices  both safari and chrome everything is broken, jump, the pinned sections are random

 

 

Hi! I solved this problem this way:

let smoother: ScrollSmoother;

if (!ScrollTrigger.isTouch) {
  smoother = ScrollSmoother.create({
    smooth: 1,
    effects: true,
  });
}

I'm just turning off ScrollSmoother for the touch devices.

My example is http://html5-coder.ru/html/project-225/index.html

Link to comment
Share on other sites

Hi @AllenIVe,

 

Sorry to hear about the troubles. We can't really debug live sites, the best we can do in those cases is just give you some suggestions. If possible create a minimal demo that clearly illustrates the problems you're having.

 

That being said, iOS has been a source of issues as stated in the ScrollTrigger docs (scroll to the end):

https://greensock.com/docs/v3/Plugins/ScrollTrigger/static.normalizeScroll()

 

You can try using normalizeScroll at the to of your file:

ScrollTrigger.normalizeScroll(true);

Or add it to the ScrollSmoother config as well:

smoother = ScrollSmoother.create({
  smooth: 1,
  effects: true,
  normalizeScroll: true,
});

Another alternative could be to use the approach given by @call007 (thanks for sharing! 🥳) for using normalizeScroll on touch devices only (it could feel a bit weird in regular desktop/laptops but that shouldn't be noticeable because of ScrollSmoother.

 

Hopefully this helps.

Happy Tweening!

Link to comment
Share on other sites

8 hours ago, AllenIVe said:

all the animations are busted, testing from browser mobile mode it works perfectly. On devices  both safari and chrome everything is broken, jump, the pinned sections are random

That sounds like something else is problematic in your code. It's impossible to say without a minimal demo and more specifics (what does "everything is broken" mean? and what jumps? and what do you mean that pinned sections are "random"?), but iOS Safari itself has several bugs and Apple has confirmed that it's literally impossible to have the scrolling thread synchronized with the main JavaScript thread which is why normalizeScroll() can be so helpful. I'm not aware of any bugs that would cause the behavior you described but then again, I'm not sure I accurately understand what you're describing. If you still need some help, please provide a minimal demo with as little code as possible (don't include your whole project) and we'd be happy to take a peek. 

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.
×
×
  • Create New...