JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container"> <div class="box">Content</div></div>

CSS

.box { width: 20px; height: 20px; border: 1px solid black; text-indent: -9999px; }

#container { width: 50px; height: 500px; background: #ddd; }

JavaScript

$(document).ready(function() {
    var $dragging = null;

    $(document.body).on("mousemove", function(e) {
        if ($dragging) {
            $dragging.offset({
                top: e.pageY,
                left: e.pageX
            });
        }
    });
    
    $(document.body).on("mousedown", ".box", function (e) {
        $dragging = $(e.target);
    });
    
    $(document.body).on("mouseup", function (e) {
        $dragging = null;
    });
});