Draggable
Drag between these two containers. Note how the stuff gets inserted near the mouse pointer? Great stuff.
Basic example
Item 1
Item 2
Item 3
Item 4
Item 5
Item 6
Item 7
Item 8
Item 9
<div class="row dragula-demo">
<div class="col-4">
<div id="left" class="dragula-block">
<div>Item 1</div>
<div>Item 2</div>
<div>Item 3</div>
</div>
</div>
<div class="col-4">
<div id="right" class="dragula-block">
<div>Item 4</div>
<div>Item 5</div>
<div>Item 6</div>
</div>
</div>
<div class="col-4">
<div id="center" class="dragula-block">
<div>Item 7</div>
<div>Item 8</div>
<div>Item 9</div>
</div>
</div>
</div>
<!-- Dragula JS -->
<script src="vendors/dragula/dist/dragula.min.js"></script>
dragula([document.getElementById('left'), document.getElementById('right'), document.getElementById('center')]);