Issues when I remove DOM element in GSAP Draggable

[Suv4o]

Hello there,

 

First of all I wold like to thank you very much for these useful GSAP libraries. They are truly amazing.

 

I been using GSAP Draggable in the last couple of weeks and I came into an issue that I cannot resolve. I provided a codepen so you can see what exactly I wanna achieve. I also provided a short video with the issue I'm facing.

 

Basically when I add a few new elements in the DOM and then I try to remove them individually, the elements don't stay in the same spot. They move on the Y axis. I don't know what is causing this issue. 

 

What I want to achieve is adding and removing elements in the DOM so they will stay on exact same spot.

 

I hope someone can help me with this issue.

 

See the Pen QWEzzjg by aleks-b-trpkovski (@aleks-b-trpkovski) on CodePen

[ZachSaucier]

Hey Suv4o and welcome to the GreenSock forums. Thanks for supporting GreenSock with a Club GreenSock membership! 

 

This issue is because all of your elements are positioned relative to each other. So when you remove an element earlier on in the DOM, the ones after it move up by the height of the removed element. Does that make sense?

 

To fix it, position your elements absolutely. Or compensate for the removed height by adding to the y position of the elements after the removed one. 

[Suv4o]

Hi Zach Saucier,

 

Thank you vey much for your help. I solved the issue. Such a banal mistake I made.