JSFiddle - React, Tailwind, and code Playground

by TJ VanToll

HTML

<script src="http://localhost/jquery/jquery-ui/ui/jquery.ui.sortable.js"></script>
<link href="http://code.jquery.com/ui/jquery-ui-git.css" rel="stylesheet" />
<script src="http://code.jquery.com/jquery-git.js"></script>
<script src="http://code.jquery.com/ui/jquery-ui-git.js"></script>

<ul id="sortable">
    <li>Item #1</li>
    <li>Item #2</li>
    <li>Item #3</li>
    <li>Item #4</li>
    <li>Item #5</li>
</ul>

CSS

li {
    display: block;
    padding: 10px;
    margin: 0 0 5px 0;
    background: #EFEFEF;
    border: 1px solid #666;   
}

JavaScript

$( "#sortable" ).sortable({
    beforeStop: function(event, ui) {
        $(this).sortable('cancel')
    }    
});