How to get the exact mouse down coordinate? Why my code does not work?

I would like to show something at the mouse down place, I tried to use :

$('#my-graph').mousedown(function(evt){

      // show object at:
      var x= evt.screenX, y=evt.screenY;

      //or show object at:
     var x2=evt.pageX, y2=evt.pa开发者_如何学GogeY;

     //code to render object at (x,y) and (x2,y2)
     ......  
});

But neither of the above (x, y) and (x2,y2) place the rendered object at the mouse clicked place, and show the object some distance away from mouse down place, why?

I render the object with a position attributes, the position is relative to the #my-graph div, left up most corner of the div is supposed to be the origin point(0,0)

You seem to want offsetX and offsetY: http://jsfiddle.net/f52Gg/.

$("div").mousedown(function(e){
    alert(e.offsetX + " " + e.offsetY);
});