javascript - Canvas Kineticjs - 鼠标位置错误

Question

我首先有文本行，然后我有画布
但是将鼠标放在画布上它是错误的（现在 y 位置的零 = 文本行的高度）
http://jsfiddle.net/dSC26/

<div id="output">output</div>
<div id="container"></div>

yoda.on('mousemove', function(e) {
    $('#output').html('position mouse on canvas: '+'x: ' + e.clientX + ', y: ' + e.clientY); 
});

我该如何解决这个问题，谢谢！

Answer 1

您可以使用event.offsetX/Yorevent.layerX/Y属性。

看看这里-> http://jsfiddle.net/dSC26/2/

yoda.on('mousemove', function(e) {
    var offsetX = e.offsetX || e.layerX,
        offsetY = e.offsetY || e.layerY;

    $('#output').html('position mouse on canvas: '+'x: ' + offsetX + ', y: ' +  offsetY); 
});

Answer 2

只需使用 stage.getMousePosition()。这里的例子：

http://www.html5canvastutorials.com/kineticjs/html5-canvas-path-mouseover/

您还可以为触摸事件起诉 stage.getTouchPosition()，或为鼠标或触摸事件起诉 stage.getPointerPosition()