Lichay Posted February 16, 2021 Share Posted February 16, 2021 Hi guys. I have a little issue with priority, I want timeline start every point in another position and don't same priority. for example const headerDiv: string = 'header+div>h3'; const headerDivDesktop = gsap.timeline({ scrollTrigger: { trigger: headerDiv, start: 'top 60%', end: 'top 30%', scrub: true, markers: true } }); headerDivDesktop.to(headerDiv, {scale: 1.25 }); // X headerDivDesktop.to(headerDiv,{x:50}); // Y headerDivDesktop.to(headerDiv,{y:50}); // Z X , Y and Z start from 60% and end from 30% on this space three of animation happened (X Y Z) I want for example X start in 60% to 40% and Y and Z start only 5% each. for now it take 1\3 of amount => mean - X 60% , Y 50% , Z 40% Thanks for helping guys See the Pen OJbpdeX by lichaytiram (@lichaytiram) on CodePen Link to comment Share on other sites More sharing options...
mikel Posted February 16, 2021 Share Posted February 16, 2021 Hey @Lichay, As an experienced GSAP forum user, you should know that your case presented in a small CodePen helps everyone. So please do it . Happy tweening ... Mikel 2 Link to comment Share on other sites More sharing options...
Lichay Posted February 16, 2021 Author Share Posted February 16, 2021 22 minutes ago, mikel said: Hey @Lichay, As an experienced GSAP forum user, you should know that your case presented in a small CodePen helps everyone. So please do it . Happy tweening ... Mikel Done Link to comment Share on other sites More sharing options...
Solution mikel Posted February 16, 2021 Solution Share Posted February 16, 2021 Hey @Lichay, Do you expect such a 'timing'? See the Pen mdOWomE?editors=0010 by mikeK (@mikeK) on CodePen Here another example: different durations and positions See the Pen qBqrgLL by mikeK (@mikeK) on CodePen Happy tweening ... Mikel 4 1 Link to comment Share on other sites More sharing options...
Lichay Posted February 16, 2021 Author Share Posted February 16, 2021 15 minutes ago, mikel said: Hey @Lichay, Do you expect such a 'timing'? Here another example: different durations and positions Happy tweening ... Mikel Thanks it really work. The property duration do the job, I think at first have another property something like priority. Thanks @mikel 1 Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now