dragSort - lightweight HTML5 drag-&-drop sorting
npm i @yaireo/dragsort --save
- Set
box-sizing: border-box
on the list or its children is a good idea - Use the provided stylesheet in this package -
dist/dragsort.css
<ul class="list">
<li>A</li>
<li>BBBBB</li>
<li>CCCCCCCCC</li>
<li>DDDD DDDDDDDD</li>
<li>EE</li>
</ul>
var listElm = document.querySelector('.list')
var dragSort = new DragSort(listElm)
Useful classes are set on elements being dragged.
Name | Type | Default | Info |
---|---|---|---|
selector | String |
all child nodes of first parameter | which elements should be draggable |
mode | String |
Use "vertical" for vertical-lists re-ordering |
|
callbacks.dragEnd | Function |
callback function when finished dragging. The dropped element is the only argument |