How can I retrieve all mouse coordinates between mousedown to mouseup event

Question

As per the jQuery docs below code can be used to capture mouseup and mouse down events. But my requirement is bit different

$(\"#dic\").mouseup(function ()          


        

Answer 1

If you need to captue all points the mouse moves through during a drag, bind/unbind a new mousemove handler:

var allPoints = [];
$("#dic").mouseup(function (e) {
    $(this).unbind("mousemove", trackPoints);
}).mousedown(function (e) {
    $(this).bind("mousemove", trackPoints); 
});

function trackPoints(e) {
    allPoints.push({ x: e.pageX, y: e.pageY });
}

This way, trackPoints will start firing when the mouse is down and stop when it goes back up.

You may also want to add a if(e.which == 1) to the top of your mouseup and mousedown handlers so that they perform the bind for a left mouse button only, not middle or right buttons.