奇妙なマウスイベントの位置問題

Question

私はマウスイベントの位置を返す関数を持っています。

// returns the xy point where the mouse event was occured. 
function getXY(ev){ 
var xypoint = new Point(); 
if (ev.layerX || ev.layerY) { // Firefox 
    xypoint.x = ev.layerX; 
    xypoint.y = ev.layerY; 
} else if (ev.offsetX || ev.offsetX == 0) { // Opera 
    xypoint.x = ev.offsetX; 
    xypoint.y = ev.offsetY; 
} 
return xypoint; 
} 

html5キャンバスで図面を実行するためにマウスイベントをキャプチャしています。時々私はxpointの値を取得しています。私がfirebugを使ってアプリケーションをデバッグすると、私は本当に奇妙な動作をしています。例えば、私がブレークポイントを条件（xypoint.x < 0 || xypoint.y <）でこの関数の4行目に置くと、ブレークポイントで停止し、そのlayer.xを見ることができます。layer.y肯定的で正しかった。しかし、xypoint.xまたはxypoint.yは負です。 firbugコンソールを使用して値を再割り当てすると、xypointで正しい値が得られます。誰もが何が起こっているか私を説明することはできますか？

通常の速度でマウスを動かすと、上記はうまくいきます。私が非常に速い速度でマウスを動かしているなら、私はこの動作を得ています。マウスの位置を取り扱い

おかげ

Answer 1

は、キャンバスとの絶対的な痛みでした。あなたは調整のトンをしなければならない。

getCurrentMousePosition = function(e) { 
    // Take mouse position, subtract element position to get relative position. 
    if (document.layers) { 
    xMousePos = e.pageX; 
    yMousePos = e.pageY; 
    xMousePosMax = window.innerWidth+window.pageXOffset; 
    yMousePosMax = window.innerHeight+window.pageYOffset; 
    } else if (document.all) { 
    xMousePos = window.event.x+document.body.scrollLeft; 
    yMousePos = window.event.y+document.body.scrollTop; 
    xMousePosMax = document.body.clientWidth+document.body.scrollLeft; 
    yMousePosMax = document.body.clientHeight+document.body.scrollTop; 
    } else if (document.getElementById) { 
    xMousePos = e.pageX; 
    yMousePos = e.pageY; 
    xMousePosMax = window.innerWidth+window.pageXOffset; 
    yMousePosMax = window.innerHeight+window.pageYOffset; 
    } 
    elPos = getElementPosition(document.getElementById("cvs")); 
    xMousePos = xMousePos - elPos.left; 
    yMousePos = yMousePos - elPos.top; 
    return {x: xMousePos, y: yMousePos}; 
} 

getElementPosition = function(el) { 
    var _x = 0, 
     _y = 0; 

    if(document.body.style.marginLeft == "" && document.body.style.marginRight == "") { 
    _x += (window.innerWidth - document.body.offsetWidth)/2; 
    } 

    if(el.offsetParent != null) while(1) { 
    _x += el.offsetLeft; 
    _y += el.offsetTop; 
    if(!el.offsetParent) break; 
    el = el.offsetParent; 
    } else if(el.x || el.y) { 
    if(el.x) _x = el.x; 
    if(el.y) _y = el.y; 
    } 
    return { top: _y, left: _x }; 
} 

道徳の物語の：私はいくつかのマイナーなエラーを持っていますが、でも、私は私のアプリで使用ドラッグアンドドロップのdivと連携しており、これを使用しますか？適切な結果を得るには、キャンバスのオフセットを計算する必要があります。イベントからXYをキャプチャしていますが、オフセットはウィンドウのXYに対してキャプチャされていません。理にかなっている？