You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I'm using Muuri to allow a user to reorder a list of fixed-size rectangles with a horizontal layout. One of my users was trying to drag an item to the end. They clicked the item, dragged it to the right of the last item, and released. But the item went back to where it started. Here is an example codepen demo:
Note that a workaround is to pause long enough over the last element, the item will go to the end as desired. But users unfamiliar with how Muuri works may not discover that workaround.
Sorry to say, but with default configuration you can only drop items on top of other items. So there is no empty space where you can drop the item.
In my case I don't need support for dropping to empty spaces in the middle of the layout. The rectangles are all the same size so there are no big gaps. But I was wondering if I can detect a drop into the space "past the end" of the list.
Question 1: The comment says "with default configuration you can only..." - is there an alternative configuration that would allow dropping an item into the space after all other items?
If I could catch the moment that the drop happens, maybe I could write my own logic to detect a drop into the "past the end" space.
Question 2: Can I listen for an event and detect that a drop is about to be cancelled, look at the drop point, then tell Muuri to send the item to the end?
The text was updated successfully, but these errors were encountered:
I found a hacky workaround by adding a placeholder element during the drag. It's tricky because I also have to remove the placeholder if the element reaches the end to avoid having the placeholder visible as a gap in the list.
I can't place an item in the space available at the end of a row even if there's a place for the item.
I can move it from the next to the last position and then again move to the last position and then the place gets activated to drag an item there.
Why it can be available at once?
I'm using Muuri to allow a user to reorder a list of fixed-size rectangles with a horizontal layout. One of my users was trying to drag an item to the end. They clicked the item, dragged it to the right of the last item, and released. But the item went back to where it started. Here is an example codepen demo:
Note that a workaround is to pause long enough over the last element, the item will go to the end as desired. But users unfamiliar with how Muuri works may not discover that workaround.
From issue #233 I saw the following comment:
In my case I don't need support for dropping to empty spaces in the middle of the layout. The rectangles are all the same size so there are no big gaps. But I was wondering if I can detect a drop into the space "past the end" of the list.
Question 1: The comment says "with default configuration you can only..." - is there an alternative configuration that would allow dropping an item into the space after all other items?
If I could catch the moment that the drop happens, maybe I could write my own logic to detect a drop into the "past the end" space.
Question 2: Can I listen for an event and detect that a drop is about to be cancelled, look at the drop point, then tell Muuri to send the item to the end?
The text was updated successfully, but these errors were encountered: