Question

当您拖动对象并且鼠标不在渲染区域时，拖动停止（触发事件）并且用户失去抓地力。

考虑到所有其他技术（Flash，原始HTML5 Canvas等）允许即使鼠标外出也能保存抓地力，这是非常不方便的。

有没有办法解决问题？

UPDATE：到目前为止，通过更改库文件并将侦听器绑定到文档而不是容器来解决问题。我知道攻击库文件是不好的，但在检查了库的源代码后，我还没有找到解决方法。

Answer 1

您可以检查该元素是否在视线之外，如果是，请将其恢复原状：

shape.on('dragend', function() {
 var pos = shape.getPosition();
 var layer = pos.getLayer();
 if (pos.y < 0) {
  pos.y = 0;
 }
 var maxY = layer.getHeight() - shape.getHeight();
 if (pos.y > maxY) {
  pos.y = maxY
 }
 shape.setPosition(pos);
}

Answer 2

看看element.setCapture()。您可以在事件处理程序中为鼠标事件调用它，例如。 mousedown：

function mouseDown(e) {
    e.target.setCapture();
    e.target.addEventListener("mousemove", mouseMoved, false);
}

虽然浏览器支持有点不稳定（IE和Firefox支持它，不确定其他浏览器），但对于跨浏览器使用，您将不得不回归到您已经遇到的文档方法的绑定。

Kinetic.js不会失去对鼠标的控制

2 个答案: