Jump to content
Search Community

ScrollTrigger and Motionpath HELP !!!!

JoePham test
Moderator Tag

Go to solution Solved by Carl,

Recommended Posts

Hi this my project with Gsap using ScrollTrigger , Motion Path
I create a function to delay speed of scroll 20px/per scroll ( mouse wheel ) but some how when character reach to section which is near bottom 
the speed suddenly slow down ( but the Speed 20px/per scroll still work you can check the scroll spacing between scroll ) 

 

i tried to find the reason why but still dont understand ( should i not try to control speed of the mouse ) ? 

 

is there anybody can help me on this ? at least show me the reason ?? 

See the Pen ExGZrWB by phm-thanh-li-m-the-animator (@phm-thanh-li-m-the-animator) on CodePen

Link to comment
Share on other sites

  • Solution

if you were to remove everything except for the motionPath animation you would see that it slows down at the end because all tweens have a default ease of "power1.out". Try using ease:"none" and see if that works better.

 

section_2.to(rec, {
        motionPath: {
            path: path,
            align: path,
            alignOrigin: [0.5, 0.5],
        },
        immediateRender: true, ease:"none"
    })

 

  • Like 2
Link to comment
Share on other sites

14 hours ago, Carl said:

if you were to remove everything except for the motionPath animation you would see that it slows down at the end because all tweens have a default ease of "power1.out". Try using ease:"none" and see if that works better.

 

section_2.to(rec, {
        motionPath: {
            path: path,
            align: path,
            alignOrigin: [0.5, 0.5],
        },
        immediateRender: true, ease:"none"
    })

 

Thanks you man you're my hero :D

Link to comment
Share on other sites

14 hours ago, Carl said:

if you were to remove everything except for the motionPath animation you would see that it slows down at the end because all tweens have a default ease of "power1.out". Try using ease:"none" and see if that works better.

 

section_2.to(rec, {
        motionPath: {
            path: path,
            align: path,
            alignOrigin: [0.5, 0.5],
        },
        immediateRender: true, ease:"none"
    })

 

Hi btw do you how to pause `scroll` for few seconds when user `OnEnterBack` ??? 
coz the problem i got now when user `OnLeave` and suddenly `OnEnterBack` with a strongly Swipe will make the object move very fast maybe right to the top within 1 seconds 

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