jQuery: calcolare la distanza tra il mouse ed un elemento

In un progetto che richiedeva un uso preciso del drag and drop mi sono trovato di fronte al problema di calcolare la distanza tra il mouse ed un elemento con jQuery. Vediamo come ho risolto il problema.

Possiamo utilizzare la seguente funzione di utility:

function calculateDistance(elem, mouseX, mouseY) {
    return Math.floor(Math.sqrt(Math.pow(mouseX - (elem.offset().left+(elem.width()/2)), 2) + Math.pow(mouseY - (elem.offset().top+(elem.height()/2)), 2)));
}

Ecco un esempio pratico:

var $element = $('#test');

$(document).mousemove(function(e) {  
   var mX = e.pageX;
   var mY = e.pageY;
   var distance = calculateDistance($element, mX, mY);
   
   console.log(distance);         
});