Jump to content
Search Community

Update scrollTrigger values

Mamboleoo test
Moderator Tag

Recommended Posts

Hey there,

I have a ScrollTrigger animation with fixed start & end values

const tween = gsap.fromTo(el, {
    background: 'red'
}, {
    scrollTrigger: {
        scrub: true,
        start: 0,
        end: 500
    background: 'blue',
    ease: 'none'

How can I update the end value on my side? Let's say after after the user opens a modal I need to update the end value to 100.

tween.scrollTrigger.end = 100; doesn't work as it is a read-only value.


I found the updateTomethod on GSAP 2.0 but it seems to have been removed on 3.0


Link to comment
Share on other sites

  • 1 year later...

Hi @mikel,


I'm new and still learning gsap along side with reactjs, so far its been a fun experience doing animation with this library!


Here I created an example using react with ScrollTrigger, I wanted to set the initial scroll position on mount, it works fine but when the initial item is on the far end of the list it will scroll fast down when the scrub is set to a number, I then set the scrub to true and gave the result I'm looking for but I need to set the scrub to a number again to make the scrolling smooth, is there a way to update the scrub value?


edit: the scrub animation not working on initial mount in the codepen not sure why


See the Pen qBpbbGZ by davidkhierl (@davidkhierl) on CodePen


Thank you!

Link to comment
Share on other sites

hi @OSUblake thank you for your response, tho is it possible to have the scrub catch up effect only applies once after the initial scroll? setting the initial scroll animates down so fast specially when I have a long list of items and I wanted to disable the catch up effect of scrub initially and update it back from boolean to number after that.

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...