GreenSock

@Transcend Studios Hm, I didn't see your attempt with wheelSpeed. Here's what I meant: https://codepen.io/GreenSock/pen/xxvVeLq?editors=0010 Notice I just set wheelSpeed: -1 and inverted the onUp and onDown callbacks. Is that what you were looking for?

First of all, thanks for being a Club GSAP member, @Transcend Studios! 💚 If you want to make wheel scrolling go in a different direction than touch-scrolling, you can easily do that by using the wheelSpeed config property: wheelSpeed: -1 // opposite direction There's also a scrollSpeed property. So you should be able to get pretty much any behavior you want.

Yeah, we'd love to help, @Whatever12344 - it's just that our hands are tied if you can't provide a way for us to reproduce the issue (a minimal demo). That error indicates that you are NOT registering ScrollTrigger before you're trying to use it -OR- perhaps your build system is ripping ScrollTrigger out of the bundle inappropriately. That would be extremely odd if you're referencing it in your code, like with gsap.registerPlugin(ScrollTrigger). Thousands of React developers are successfully using ScrollTrigger in their projects without any problems, so this certainly sounds like an issue with your particular setup. Once we see a minimal demo that clearly illustrates the issue, I'm sure we'll be better equipped to offer suggestions.

@Jo Mourad have you tried the DOMContentLoaded event suggestion? We are chatting with the Webflow team about better integration, so hopefully that'll be fruitful. 💚

I just checked on an iPhone and MacBook Pro in Safari and I cannot replicate that issue. Can you please provide more details? I wonder if you have some kind of browser plugin that's interfering or a beta version of Safari with bugs(?)

I agree - as long as you gsap.registerPlugin(ScrollTrigger) before you run a tween/timeline that has a ScrollTrigger, you'll be fine. You really shouldn't need to, but you could also tuck the gsap.registerPlugin(ScrollTrigger) inside your useGSAP() function. Also, neither of these are valid ScrollTrigger config objects: // NOT valid effects:'true', renderImmediately: false Maybe you meant immediateRender: false?

Just make sure you resume() the timeline; when you set timeScale(0) it's like calling pause(). https://codepen.io/GreenSock/pen/yLmNNrm?editors=1010

Welcome back to GSAP, @timherbert! 💚 Yeah, it's just a syntax problem on your end. when you follow a function name with "()", that tells JavaScript to immediately invoke it. // BAD onComplete: testComplete() // GOOD onComplete: testComplete So when you do onComplete: testComplete(), that actually calls the function right away and then assigns whatever that function returns to be the onComplete. It's just how JavaScript works; it has nothing to do with GSAP. Also, our licensing hasn't changed at all - it was always quite lenient. 👍 Enjoy the tools.

I wouldn't necessarily call this a "bug", but the behavior is different in v3.x and that was somewhat intentional. The problem is that when you remove() an animation from the parent timeline, it doesn't live anywhere. There's no parent timeline to scrub its playhead (all animations need a parent timeline to scrub their playhead except the globalTimeline). So here's a pretty simple solution: https://codepen.io/GreenSock/pen/yLmLver?editors=1010 Basically, add it to the globalTimeline after you remove() it from its parent. Does that clear things up?

I might be misunderstanding what you're saying but... Disabling a ScrollTrigger doesn't cause ScrollTrigger to suddenly force the scroll position elsewhere - I think what you're seeing is just a logic issue inherent in removing pinSpacing. A ScrollTrigger with pinning would create a pinSpacer by necessity and alter the total amount of available scrolling, so disabling that and removing the pin spacer would of course collapse things and cause the total amount of available scroll to change. If you want to run special logic to make it APPEAR to stay where it was (even though it's not), you could do that yourself where you disable() the ScrollTrigger. It's typically not great to resurrect a 4 year old thread - if you need help, I'd suggest starting a new thread. 👍

First of all, thanks for being a Club GSAP member! 💚 Are you getting any errors? Do things work the way you expected? Do you have a minimal demo you could share that clearly illustrates the issue (like a CodePen or Stackblitz)? Did you try importing both GSAP and CustomEase from the same directory (either the UMD modules like "gsap/dist/gsap" and "gsap/dist/CustomEase" or the ES modules like "gsap" and "gsap/CustomEase")?

Actually, normalizeScroll() was specifically created primarily because of iOS and all of its bugs and inconsistencies. But it's not a silver bullet - you can certainly disable it if you prefer. Last I checked, I don't think Apple has provided a good way to prevent the address bar from showing/hiding. Any possible way had other tradeoffs too. iOS is just terrible scrolling-wise. There are known bugs that Apple hasn't fixed for years and they have been unresponsive to our pleas for help. I wish I had a great answer for you.

Welcome to GSAP, @sugaya325! If you answer "yes" to any of the following, you'd need the special commercial license that comes with "Business" Club GSAP memberships: Do you have multiple developers that need access to the bonus plugins like SplitText, ScrollSmoother, MorphSVG, etc.? Does your GSAP-enhanced website/game/product require the user to pay a fee to use? (like Netflix.com) Are you selling a GSAP-enhanced product to multiple end users? (like a website template, theme or game) Are you using GSAP in a game/app with optional paid features/upgrades? If your website sells products that aren't GSAP-enhanced like clothing, widgets, food, etc., that doesn't require the commercial license. It only matters if the thing for which a fee is collected uses GSAP in some way. The standard "no charge" license even covers usage in projects where only a one-time development fee is charged, like an agency that's paid to build a fancy web site that's free for everyone to use. So based on the fact that some pages on your site require paid access, the "Business" Club GSAP membership is appropriate here. In terms of how to count developers, it’s based on the number of people who would actually use GSAP tools. It’s not intended to be a license that gets passed around from person-to-person, like “Hey Sally, can you stop using GSAP for 5 minutes so I can update something?” So if a company has 3 developers who use GSAP from time to time, they should get a license that covers all 3 developers. You can always upgrade later too. We like to think that a Club GSAP membership pays for itself very quickly when you consider all the time it’ll save, the added capabilities that the bonus plugins deliver...and of course that sense of having animation superpowers is priceless 🙂 Let us know if we can help with anything else. We look forward to seeing you on the membership roster soon. 💚

Yeah, this sounds pretty odd - are you absolutely positive that the SplitText.min.js file is successfully loading BEFORE you try referencing SplitText? Just as a test, maybe you could try delaying your code that references GSAP, sorta like: setTimeout(() => { gsap.registerPlugin(ScrollTrigger, TextPlugin, SplitText, MorphSVGPlugin); // ... more code ... }, 5000); // <-- wait 5 seconds The goal is to just see if waiting long enough to ensure the files have all fully loaded makes it work. I'm also curious what this shows in your context: console.log(gsap.core.globals().SplitText); // ?? It sure sounds like it's either not loading the file at all, or you're trying to reference it before it's loaded, or there's a very strange scoping issue. Super difficult to troubleshoot blind though. Do you have a link to a URL that shows the issue?

Just to be clear, GSAP doesn't change ANYTHING when a device is in low-power mode; the problem here is that iOS devices suddenly slow down JS execution (the frame rate in particular, like requestAnimationFrame()) significantly when in low-power mode. The device is doing that, and GSAP has no way of forcing it back to normal performance levels. It's not a limitation of GSAP; it's a browser-forced issue.