motionpath move icons imgs along svg path

[fawad4Real]

Hey there! I have a request. I have completed 95% of the animation, but I'm facing an issue with the last item. I want the icons to loop at a specific distance repeatedly, but the problem is that each icon completes a duration of 40s and gets merged together, which is not what I want. Do you have any solutions for this issue? Thanks!

issue I am facing.

 

what I want is something like this, which keeps moving in an infinite loop at a slow speed.

my codepen

See the Pen bGZLVOy by Fawad4real (@Fawad4real) on CodePen

[Carl]

This seems just like a recent lesson from my SVG Animation with GSAP course.

 

The general idea is that each item has it's own repeating animation created in a loop

 

See the Pen zYyBKmG by snorkltv (@snorkltv) on CodePen

[fawad4Real]

Thanks but can you edit my codepen so I can easily understand it? yours has to much code, make be bit confused .

[Carl]

Sorry, I'm not sure I can edit it so that you easily understand it. That's why I spend hours creating video lessons that explain everything in detail.

 

However, this is what the edited code would look like:

 

See the Pen wvOyeYO?editors=0010 by snorkltv (@snorkltv) on CodePen

 

Good luck with the rest of your project

[fawad4Real]

Thanks a lot, it did solve my problem.