Carousel dots on SVG path (MotionPathPlugin)

[Vitalij Virsulo]

Hello,

I am new with GSAP, but i see that it amazing library... So I have i question, maybe same one have an example with the code.

I need to have a full width waved SVG line path with dots on it and navigation buttons "next" and "prev". On button click dots should go to next position. It should be like a carousel with loop and dot in center should be an active. Also if it can be draggable so it will be amazing...

 

Thanks you very much for help.

[Cassie]

Hi Vitalij,

I'm afraid we don't have the resources to sculpt custom solution for people in these forums.

We're more than happy to help with GSAP-specific questions though. Why don't you give it a shot and if you get stuck come back here with a question.

Here's a carousel for some logic to get you started

See the Pen wvdJEXV by GreenSock (@GreenSock) on CodePen

And here's a plugin that may prove useful
 

 

[mikel]

Hey VITALIY,

 

As a starter, this example could be helpful.

 

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

 

Happy tweening ...

Mikel

 

 

 

[Vitalij Virsulo]

mikel nice! thanks you!