search

marceljuenemann / angular-drag-and-drop-lists

Angular directives for sorting nested lists using the HTML5 Drag & Drop API
MIT License
2.16k stars 713 forks source link

Expanding a collapsed list when mouse is over it #509

Open ricfwolff opened 4 years ago

ricfwolff commented 4 years ago

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?

cird24 commented 1 year ago

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.