Jump to content


  • Posts

  • Joined

  • Last visited

Posts posted by thirsty

  1. 6 minutes ago, Prasanna said:


    The registry service used by npm.greensock.com uses the official npm registry as fallback registry. Hence you would still be able to install all packages when you set npm.greensock.com as the global registry. There is no problem with configuring npm.greensock.com as the global registry but package installation could be slower in some cases (in cases when the package requested is not readily available in the npm.greensock.com registry)


    As for the fallback registry, it is currently not possible to set two global registries. But you can set a registry for scoped packages and use global registry as a fallback.

    Ah ok, interesting, probably not the best to rely on greensock for all of our dependancies.

    It's weird that @gsap:registry='...' doesn't work to single out the gsap repository? Even though it works locally, I'll check what yarn version netlify uses

  2. 2 minutes ago, Prasanna said:


    Yes it does, but as a practice it is recommended no to commit tokens/keys in your project.

    Just removes the hassle of setting env var NPM_TOKEN for every yarn command 😮

    Any idea why setting global registry to npm.greensock.com works lol? You think there's some kind of fallback system that yarn and npm use if the registry endpoint doesn't return a package?

    As in, there's no issue installing any other packages even though registry is set globally to greensock domain?

  3. 2 minutes ago, GreenSock said:

    Yep. I've got a little experience with that kind of thing ;)


    It was an excuse to try to make one that's as bare-bones as possible. I tend to geek out over that kind of thing. 🤔


    Yep, you could totally implement a tween for the dragging instead of a direct setting of the scroll position. And then give it whatever duration you want (just remember overwrite: true so you're not creating lots of conflicting tweens). 


    So yeah, you could set your scrub value to whatever the shortest one should be (dragging/buttons/scrolling) and then for the ones that you want to take longer, simply tween them accordingly with whatever duration you want. 


    Fun, right? GSAP handles getter/setter methods which can be super useful. Once you learn that you can use one tween to animate the progress or timeScale of another tween...it's kinda mind-blowing. 🤯


    You're welcome. Good luck with the project!

    Awesomeeeeeeeeeeee and thank you again :D❤️ 

  4. 12 minutes ago, GreenSock said:

    No, you can't alter the scrub value, but you could get a similar effect by simply tweening the scroll position to make things longer.


    Candid admission: usually we don't do "build-to-order" things in these forums, but I got curious and love a challenge, so as a courtesy I whipped together an example and even made the page draggable: 





    Notice the buttons create a tween of the scroll position and they take 2 seconds to complete. Obviously you can tweak that to whatever you want. 


    Does that help? 

    Did you really just roll your own Draggable implementation? Impressive

    It does help, although I was hoping to be able to modify the scrub value so I could change the dragging behaviour compared to scroll behaviour, now I'm thinking I'll try this custom tween solution for getting a different drag behaviour too?

    ps. had no idea you could target a scrollTrigger with gsap.to ?! that's wild

    thanks so much for the reply you went above and beyond, gonna help a ton :D

    • Like 1
  5. I have been working on a homepage redesign for a company, and they want the scroll animation to work via A, scrolling, B, dragging, and C, clicking on arrow buttons on mobile.

    For A it was easy enough to do a ScrollTrigger timeline, for B I implemented Draggable and did an onDrag scrollTrigger.scroll() call, but for C, I want to slow down the scroll speed, since I'm calling scrollTrigger.scroll(someScrollAmount),

    It seems there is an ideal scrub value for each use case, so I would love to be able to set scrollTrigger.vars.scrub, and have it change the scrub value for when I call scrollTrigger.scroll() manually.

    I've made a small reproduction here with big UP and DOWN buttons

    See the Pen oNGQbOB by lopupen (@lopupen) on CodePen