Custom ghost element

[piterpal]

First of all, congratulations for the library, I wanted to ask you if it is possible to completely define the element that is dragged (ghostelement) in many cases, the element to be dragged is large and makes it difficult to fit it into the drop zones.

Thank you so much!

[amendx]

Hi, @piterpal thank you so much!! could you give me an example of what you mean?

[piterpal]

Hi!!

I'm building a small form editor, from the left, controls can be dragged, and then in the main area of the page, they can be configured and "manipulated".

In this way, there are two containers, one from which new controls are "copied" and created and another one on which new ones are dragged or existing ones are moved and configured.

In the first video, you can see that when I drag an element with a low height, it is easier to "drop" between the elements of the form

In the second video, when dragging a large object, it is no longer easy since I understand that you need to "overlap" its rectangle in the drop area so that it is admitted

If you could specify a completely different DOM element than the one actually being dragged, even though the image you're dragging doesn't match what you've selected, the drop operation would be more streamlined and intuitive.

I don't know if it would be possible, just as there is a callback to select the payload, another one that can define the html element that will be used as ghost while dragging, in this way, in the case of dragging large objects, I could specify a small object like in the first video when dragging from the left.

Thank you very much for your help and congratulations again for the library!! Pedro