Vista de lista arrastrable con vanilla JavaScript
| Autor: | loonywizard |
|---|---|
| Views Total: | 1,853 |
| Sitio oficial: | Ir a la web |
| Actualizado: | December 21, 2017 |
| Licencia: | MIT |
Vista prévia
Descripción
Una biblioteca de JavaScript ES6 para crear una vista de lista donde los usuarios pueden volver a ordenar los elementos de la lista a través de arrastrar y soltar.
Funcionamiento
Instale la biblioteca.
# Yarn $ yarn add native-js-dnd-list # NPM $ npm install native-js-dnd-list --save
El código HTML de la vista de lista.
<div id="list" class="list"> <div class="divider"></div> <div class="item"> Hello! <div class="item-id">(id: 0)</div> </div> <div class="divider"></div> <div class="item"> This is drag'n'drop list written on native javascript <div class="item-id">(id: 1)</div> </div> <div class="divider"></div> <div class="item"> Just drag and drop list items to see how it's working! <div class="item-id">(id: 2)</div> </div> <div class="divider"></div> <div class="item"> If you're interesting in source code, check my <a href="https://github.com/loonywizard/native-js-dnd-list" target="_blank">GitHub repo</a> <div class="item-id">(id: 3)</div> </div> <div class="divider"></div> <div class="item"> Found any bugs or have a suggestion? Please, add an <a href="https://github.com/loonywizard/native-js-dnd-list/issues" target="_blank">Issue</a>! <div class="item-id">(id: 4)</div> </div> <div class="divider"></div> </div>
