Animated drag sorting for hori
lightweight HTML5 drag-&-drop sorting Installation
npm i @yaireo/dragsort --save
Pre-setup suggestions:
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
Usage
HTML
<ul class="list"> <li>drag & drop</li> <li>items</li> <li>easily</li> <li>with this</li> <li>super lightweight script</li> </ul> javascript
import DragSort from '@yaireo/dragsort' import '@yaireo/dragsort/dist/dragsort.css' const listElm = document.querySelector('.list') const dragSort = new DragSort(listElm)
SettingsNote - useful class names 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.dragStart | Function |
callback function when dragging started. Arguments are (element, event) |
|
| callbacks.dragEnd | Function |
callback function when dragging finished. Arguments are (element, event) |
版权声明：
1、该文章(资料)来源于互联网公开信息，我方只是对该内容做点评，所分享的下载地址为原作者公开地址。2、网站不提供资料下载，如需下载请到原作者页面进行下载。
