draggable slider issue (when more than one slider on page)

[michael_feh]

hey there, 

i have edited a slider codepen of yours to make if fit for my case:

this seems to work fine.

See the Pen oNObOry by frontendhomie (@frontendhomie) on CodePen

[michael_feh]

the problem is, i need many of those slider elements on one page.
i have gotten this far:

See the Pen KKYVLKz by frontendhomie (@frontendhomie) on CodePen

the next, prev, random button still work, but the dragging and snapping seems off.

help please

[GSAP Helper]

We love helping with GSAP-related questions, but unfortunately we just don't have the resources to provide free general consulting, logic troubleshooting, or "how do I recreate this cool effect I saw on another site?" tutorials. Of course anyone else is welcome to post an answer - we just want to manage expectations.  

 

You are welcome to post in the "Jobs & Freelance" forum for paid consulting, or contact us directly. 

 

Otherwise, if you've got a GSAP-specific question just post that here along with a minimal demo and we'd be happy to take a look. 

[Rodrigo]

Hi,

 

I believe that the logic you're using in your Draggable instance could be the cause of all this. Honestly if you want to snap and you're using the Inertia Plugin, why not let the plugin do the heavy lifting for you? Is super simple:

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

 

When using the Inertia Plugin you can add a snap callback in your Draggable config object, that particular function has one parameter, the end value calculated by the Inertia Plugin. You can use that in combination with the snap utility method and it will always land in a card.

 

Hopefully this helps.

Happy Tweening!

 

[michael_feh]

thanks for guiding me in the right direction.
i got the job done with Inertia.

 

🙏