Jump to content
Search Community

Scoll-based animation botched for mobile...please help!

aprince test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

I am using a combination of ScrollMagic and GSAP to achieve a scroll-based (100% height/duration) animation at the top of my page. Everything works great in Safari/Chrome/Firefox, but when I test on mobile (iOS) the animation is all screwy. Seems to be an issue with overflow and/or viewport height, but I cannot seems to find a fix. Apologies in advance if this is an issue related to ScrollMagic (not GSAP), as I am still getting acquainted with both. Live site can be found here:


Link to comment
Share on other sites

Welcome the forums, aprince. We'd love to help, but unfortunately we just don't have the resources to provide free general consulting services for troubleshooting projects where there are a bunch of other things at play (we didn't create nor do we directly support ScrollMagic, and it looks like you've also got animate.css on that page for CSS animations which could cause conflicts, etc.). We'd be happy to answer any GSAP-related questions though. 


I'm pretty confident the issue you're running into is not related to GSAP. It sounds more like a CSS or media query thing or some funky logic somewhere. I noticed you're doing some custom JS on every "scroll" event which is a tad dangerous (it can just be very CPU-intensive and cause layout thrashing). 


If you still think it's a GSAP issue, I'd suggest creating a reduced test case that isolates things further (probably remove the animate.css stuff and ScrollMagic) and shoot us a codepen (or jsfiddle) link to peek at. Again, we're happy to help with any GSAP question and I wish we had more resources to offer more general consulting services. Perhaps someone else here will have the time to dig in and analyze all that you've got going. 


Happy tweening!

  • Like 5
Link to comment
Share on other sites

Understood, and thanks for the thorough response. I am troubleshooting now, per your suggestions. I will be sure to post my findings if they seem useful to this forum. Thanks for an amazing tool...just getting familiar, but super fun so far!

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