Lorenz Perszyk
Content Type
Profiles
Forums
Store
Blog
Product
Showcase
FAQ
Downloads
Posts posted by Lorenz Perszyk
-
-
Hello GSAP-Community,
New user here, having a bit of hard time with some simple scrollTrigger animations.The Problem: The animations basically do what they are supposed to, but the tweening
values per step are not even. The values are very large at the beginning and just before
the trigger reaches the end each step is sub 1% ( if viewed with the Inspector) . It almost
looks as if there was a default easing in place. If I disable the scrub, it does look like
there is an ease applied. I have also tried setting the initial width/position in CSS, but read
that it's better to do so in GSAP directly. Also tried with .set and .to, with the same outcome.Considering the animation is working, I hope it's some small detail or syntax logic I missed.
Running on Mac OS (Version 10.15.7) and Firefox ( Version 105.0)Any help much appreciated.
See the Pen NWMamZM by lorenz-perszyk (@lorenz-perszyk) on CodePen
srollTrigger tweening problem
in GSAP
Posted
Hello akapowl,
Thank you for taking the time to reply to my question!
I think at one point in my hours long search I did set it to ease: 'none' , unfortunately with
the same effect. Looking at the issue again, I just realized I had simply placed it in the
wrong place. I set it in the scrollTrigger object instead of the target element. It's all fixed
|and working now, thank you for pointing me in the right direction!
Solution: To create a linear tween set ease: 'none' on the target object settings, NOT on
the scrollTrigger object.
e. g. (increase an element's width from 50% to 100%)