我正在尝试使用 html5 img 标签将多个图像加载到画布上。
并且图像是可替换的。例如,有 5 个图像列表图像也是可拖动
的,并且特定图像的 onclick 会替换同一列表中最后上传的图像,
我面临的问题是,当我上传新元素时,它会出现在其他之上。和底部元素的 onclick 我希望它移动到顶部并拖动。我尝试使用名为 move to top 的 kineticjs 函数,但没有发生任何事情。我还检查了库,一切正常...
我无法将完整代码粘贴到此处,因为它太大了。
这是我尝试添加移动到顶部功能的部分:
function drawImageOnLayer(layer, img) {
var x = stage.width / 2 - 100 ;
var y = stage.height / 2 - 200 ;
var width = 200;
var height = 400;
var kinecticImg = new Kinetic.Shape(function(){
var context = this.getContext();
context.drawImage(img, x, y, width, height);
// draw invisible detectable path for image
context.beginPath();
context.rect(x, y, width, height);
context.closePath();
});
// enable drag and drop
kinecticImg.draggable(true);
此功能不起作用
kinecticImg.on("mousedown", function(){
this.moveToTop();
layer.draw();
结尾
});
layer.clear();
layer.add(kinecticImg);
layer.draw();
}