JSFiddle - React, Tailwind, and code Playground

by Avi Algaly

HTML

<div id="follower">Move your mouse</div>

CSS

#follower{
  position : absolute;
  background-color : red;
  color : white;
  padding : 10px;
}

JavaScript

var mouseX = 0,
    mouseY = 0,
    mouseUp = false;
$("#follower").mousedown(function(e) {
mouseUp = false;
    $(document).mousemove(function(e) {
        if (mouseUp) return;
        mouseX = e.pageX;
        mouseY = e.pageY;
    });
}).mouseup(function(e){
    mouseUp = true;
    //this.unbind("mousemove" ,$(this)); TODO: wont unbind!
})
// cache the selector
var follower = $("#follower");
var xp = 0,
    yp = 0;
var loop = setInterval(function() {
    // change 12 to alter damping, higher is slower
    xp += (mouseX - xp) / 12;
    yp += (mouseY - yp) / 12;
    follower.css({
        left: xp,
        top: yp
    });

}, 30);