Question

I want to record x coordinates in the following situation

when mouse is pressed down i should get X1 and if mouse is moved keeping button pressed and then when it is unpressed at that time X2

i can detect mouse down and mouse up events but not sure how to do it what i want

Answer 1

This function demonstrates the general idea in modern, standards-compliant web browsers but there are many details (such as cross-browser awareness, the scroll view, etc.) that might be better handled with a framework such as jQuery:

(function() {
  var dragStart, dragStop;
  document.body.addEventListener('mousedown', function(e) {
    dragStart = [e.clientX, e.clientY];
  }, true);
  document.body.addEventListener('mouseup', function(e) {
    dragStop = [e.clientX, e.clientY];
    if ((dragStart[0] != dragStop[0]) && (dragStart[1] != dragStop[1])) {
      console.log("DRAGGED: [" + dragStart + "] => [" + dragStop + "]");
    }
  }, true);
})();

Note that you’ll also want to check for “mousemove” events in between the “mouseup”/”mousedown” in case the latter two events happen to occur at the same location.