Draggable list
This script has approximately 1 Kbyte
The jSuites.sorting
is a lightweight JavaScript to create sortable lists with events. You can drag of of the following items in the list below to re-order the elements.
- Test 1
- Test 2
- Test 3
- Test 4
Source code
<html> <script src="https://jsuites.net/v4/jsuites.js"></script> <link rel="stylesheet" href="https://jsuites.net/v4/jsuites.css" type="text/css" /> <ul id='draggable-elements' class='cursor'> <li>Test 1</li> <li>Test 2</li> <li>Test 3</li> <li>Test 4</li> </ul> <script> jSuites.sorting(document.getElementById('draggable-elements'), { ondrop: function() { console.log(arguments); } }); </script> </html>
Methods
Method | Description |
---|---|
ondragstart | Call the method when drag starts |
ondragend | Call the method when drag ends |
ondrop | Call the method on the drop. ondrop(DOMElement, int from, int to, DOMElement, DOMElement, mouseEvent) |