mikel

Hey @Wizard of Oz
 
This would be my logic to design a continuous slider.
Expandable with split text.
If you are interested in array methods, more e.g. here.
 

See the Pen qBpZObp by mikeK (@mikeK) on CodePen
 
Happy tweening ...
Mikel

Hey @fernandocomet,
 
There are several options:
 

See the Pen ZEGyeEr by mikeK (@mikeK) on CodePen
 

See the Pen NWXPpde??editors=1010 by mikeK (@mikeK) on CodePen
 
Do you mean something like that?
 
Happy tweening ...
Mikel
 

Hey @iDad5,
 
You could use ScrollTrigger.addEventListener.
Here an example
 

See the Pen c1099fe6d3d8c43ec2b928f006551450?editors=1010 by mikeK (@mikeK) on CodePen
 
Happy scrolling ...
Mikel
 

Hey @samwatts1988,
 
What should be morphed to what result is not really clear to me.
Here is just one interpretation
 

See the Pen ExbLxwE?editors=1010 by mikeK (@mikeK) on CodePen
 
Happy tweening ...
Mikel
 

Some logic and here we are ...
 

See the Pen yLPrNKy?editors=1010 by mikeK (@mikeK) on CodePen
 
Sun is shinning and in a few minutes I am out of home ...
Mikel
 

Hey Allen,
 
If the two paths for moving point and tail are identical,
both have the same coords, have the same start/end points, there shouldn't be a problem.
 

See the Pen NWwJGad??editors=0010 by mikeK (@mikeK) on CodePen
 
Happy tweening ...
Mikel
 
 
 

Hey @Yaya,
 
You need  MotionPathPlugin.convertToPath("circle, rect, ellipse, line, polygon, polyline");
and for the circle a closing  > 
Plus: an overflow:visible for this SVG.
 

See the Pen c23ede8ad7873280de000904bac80289??editors=1010 by mikeK (@mikeK) on CodePen
 
A MotionPath animation based on a circle starts at 3 o'clock.
You could rotate the circle as you need in advance.
 
Happy tweening ...
Mikel

Hey @Yannis Haismann,
 
There is always an alternative. Here is an example with GSAP SplitText, where individual letters are animated.
This also works with single, concrete words.There is always an alternative. 
 

See the Pen MWOGqJG?editors=0010 by mikeK (@mikeK) on CodePen
 
Happy splitting ...
Mikel
 

Hey @OSUblake,
 
Simple and cool ...
 

See the Pen jOaYzYz?editors=1000 by mikeK (@mikeK) on CodePen
 
Happy speeding ...
Mikel
 
 

Hey @Jay George P,
 
Depending on your feelings, try the values:
end:'+=2000' or more
scrub: 0.3 for example
and set the tween ease:'none'
 
Happy tweening ...
Mikel
 
 
 

Hey @Altea,
 
This case might help you:
 

See the Pen KKmdMdX?editors=1010 by mikeK (@mikeK) on CodePen
 
Happy tweening ...
Mikel

Hey @embrion
 
You could use gsap.delayedCall(3, () => vid.pause()); to pause the video.
 

See the Pen WNXwvRj??editors=1010 by mikeK (@mikeK) on CodePen
 
Happy tweening ...
Mikel

Hey @Zoker,
 
try a separate scrollTrigger for each element:
 
gsap.utils.toArray('.fadein').forEach(function(part) { gsap.from(part, { scrollTrigger: { trigger: part, start: "center bottom", end: "bottom bottom", scrub: 0 }, opacity: 0 }); });  
Happy tweening ...
Mikel

Hey @DexteRs Code,
 
Maybe you could implement this logic with two stagger-tweens at a proper time
 

See the Pen zYwOzZq by mikeK (@mikeK) on CodePen
 
Happy tweening ...
Mikel

Hey SANDY SAMEH,
 
A prepared CodePen with your case would be a polite gesture, it would save me some effort.
Does this scenario correspond to what you have in mind?
 

See the Pen XWgaPMp by mikeK (@mikeK) on CodePen
 
Happy tweening ...
Mikel
 

Hey VITALIY,
 
As a starter, this example could be helpful.
 

See the Pen eYRRgQZ by mikeK (@mikeK) on CodePen
 
Happy tweening ...
Mikel
 
 
 

Hey Weinde,
 
You can define the relevant objects for a loop.
Then this is how it works
 

See the Pen XWgMvGy?editors=1010 by mikeK (@mikeK) on CodePen
 
Does that help?
Mikel
 
 

Hey WHIZZBBIG,
 
This could be an option:
 

See the Pen abmPjxz by mikeK (@mikeK) on CodePen
 
Happy tweening ...
Mikel

Hey @LSchneiderman,
 
Of course you can also use GreenSock ScrollTrigger.
Turn up the volume.
 

See the Pen yLbZJra?editors=1010 by mikeK (@mikeK) on CodePen
 
Happy tweening ...
Mikel
 
 

Hey @lgo,
 
That´s a job for stagger.
 

See the Pen XWRYVoM by mikeK (@mikeK) on CodePen
 
Happy tweening ...
Mikel

Hey @.mdl,
 
Try a specific position for the SVGs.
 
svg { position:absolute; top: 50%; left: 50%; width: 50%; height: 50%; overflow: visible; transform: translate(-50%, -50%); }  
Your code could be simplified a lot more.
 

See the Pen bGWKWwV by mikeK (@mikeK) on CodePen
 
Happy scrolling ...
Mikel

Hey @Sawqa172
 
Welcome to the GreenSock Forum.
Maybe this demo will lead you to your goal.
 

See the Pen abWGrXX by mikeK (@mikeK) on CodePen
 
Happy scrolling ...
Mikel
 
 

Hey @purple-lightsaber,
 
You could use GSAP DrawSVG.
 

See the Pen XWjaBgm by mikeK (@mikeK) on CodePen
 
Happy tweening ...
Mikel
 

Hey @renny,
 
Perhaps this example will give you some inspiration.
 

See the Pen xxdGxNV?editors=1010 by mikeK (@mikeK) on CodePen
 
Happy scrolling ...
Mikel
 

Hey @hmontelongo,
 
Welcome to the GreenSock Forum.
 
 

See the Pen wvdwKXb by mikeK (@mikeK) on CodePen
 
Happy tweening ...
Mikel