How can I fix weird jump at the start of loop?

[Jess.Park]

I have multiple absolute positioned h1s.

I want to make h3 to follow smoothly along h1's offsetHeight on loop.

 

But on repeat,h3 starts with a jump from top.

How can I fix the jump at the start of loop?

 

Since I'm doing something else in my project, I must use timeline within h1s.forEach.

 

 

See the Pen dyzJzyd by impetusjj (@impetusjj) on CodePen

[elegantseagulls]

This is tricky because you'll have to tween the h3 back to its original position, or it doesn't have a context of where it's really starting from...

 

With what you have going on the forEach, you are creating a new timeline for each iteration.

 

This solution adds to a single timeline onEach, then goes back to its original position:

See the Pen JjyMpRx?editors=0110 by ryan_labar (@ryan_labar) on CodePen

[Jess.Park]

Thank you so much! I’ll try this approach right away 😆