angular-drag-and-drop-lists icon indicating copy to clipboard operation
angular-drag-and-drop-lists copied to clipboard

Expanding a collapsed list when mouse is over it

Open ricfwolff opened this issue 5 years ago • 1 comments

I have several horizontal lists, each one with draggable items in it. But the lists are all collapsed (because of size and rendering problems). I want to drag one element from one list to another. But, when I drag the item over the list "header", I want it to expand to show its items so the user can choose where to drop it.

image

image

Is it possible?

ricfwolff avatar Feb 27 '20 18:02 ricfwolff

I had the same problem. Would be so easy if only we could use basic HTML event while dragging. I managed to do it by creating a dndDropZone on the HTML tag I wanted to expand without actually giving it any instructions for dndDrop. But this way, I was able to set dndDragover which is basically the same as a simple mouseover but while on Drag. This event triggered, I could easily make my div expand and that's it.

cird24 avatar Jul 07 '22 19:07 cird24