1

我正在使用 KineticJS。我有一个带有可拖动、可调整大小图像的画布(代码刚刚复制自:http ://www.html5canvastutorials.com/labs/html5-canvas-drag-and-drop-resize-and-invert-images/ )。可拖动、可调整大小的图像在一层上,而我在另一层上有一个矩形。矩形层位于顶部。矩形是透明的(没有填充)。

当我将图像拖到矩形下方并再次尝试单击图像时,图像当然不会移动 - 因为它不在顶部。矩形在顶部。但是,我想单击“通过”透明矩形并继续作用于下面的图像。换句话说,当您单击并拖动时,我希望它看起来好像矩形不存在,但我希望矩形显示在顶部。

这是一个演示: http: //jsfiddle.net/T8m64/106/ 将图像拖到矩形下方,您将看到无法再抓取它,因为它在下方。[我完全知道这不是“不显眼的 javascript”,即 javascript 嵌入在 html 中。对不起。我只是从上面的第一个链接中复制的。]

无论如何,正如我所说,演示是从上面的第一个链接复制的,最后添加了以下代码:

//Overlying rectangle. I'm doing it as a path not a rect, because that's ultimately what I care about
var rect = new Kinetic.Path({
    x: 0,
    y: 0,
    data: 'm 2.0012417,2.0057235 125.7664883,0 0,105.8016465 -125.7664883,0 z',
    fill: 'none',
    stroke: 'black',
    scale: 1
});

// add the shape to the layer
var rectLayer = new Kinetic.Layer();
rectLayer.add(rect);
stage.add(rectLayer);
rectLayer.moveToTop();

谢谢

4

1 回答 1

2

您可以告诉图层停止侦听事件。

这将允许下面的层响应这些事件。

rectLayer.setListening(false);
于 2013-04-20T22:42:14.473 回答