Assafi

P E R F E C T! This is exactly what I needed!!! Thank you so much! If I may just one more little question - can I invalidate a timeline or ScrollTrigger upon mouse event as well?

Ok that was easy! But actually, I need something a little bit more complicated. I need to change a value inside a tween before it ends and repeats. I have a scroll-triggered timeline that pins an element until it tweens all the way to the end of it and then the regular scroll continues. I calculated the amount it needs to move and placed it in a variable (to_scroll_dis). Let's say the element's width changed due to screen resizing - how can I change this variable while the timeline is running? In the example, I added a button to change the width of the element to imitate this kind of situation. I need to end the animation exactly where the element is ending, and as you can see - when I resize it needs to be recalculated and placed again in the timeline. Thanks in advance for your help! https://codepen.io/the_w4/pen/poQzKqL

Hi! I am trying to build a timeline, that changes on demand. In the Code Pen attached you can see a simple circle animation, it goes 250px to the right and back. I want the distance the circle passes will change upon button click. Any ideas? Thanks!