javascript - EaselJS - 舞台鼠标悬停

Question

我最近发现了EaselJS，我正在尝试制作一个非常简单的 Canvas 射击游戏。

我的 Canvas 宽度为 500 像素，高度为 500 像素。

当用户的鼠标进入 Canvas 时，目标会随着鼠标移动，并且应该可以射击目标(即位图)。

这应该与我们在许多网站上看到的一些广告游戏非常相似 - “使用鼠标并触摸 X 来获胜!”等等。

但是，我一直在尝试做一些非常简单的事情 - 让目标 Sprite 跟随用户的鼠标光标。

如果我忘记或做错了一些非常琐碎的事情，我提前道歉。这是我的(Javascript)代码:

<script>
window.onload = function()
{
  init();
}

function init() 
{

var canvas = document.getElementById("my_canvas");
var stage = new createjs.Stage(canvas);

//background picture
var background_sky = new createjs.Bitmap("sky.png");
stage.addChild(background_sky);

//target sprite picture
var target_sprite = new createjs.Bitmap("target.png");
stage.addChild(target_sprite);

target_sprite.x = 150;
target_sprite.y = 150;

stage.enableMouseOver(20);

stage.on("mouseover", function(e) 
{
   target_sprite.x = e.stageX;
   target_sprite.y = e.stageY;      
   stage.update();
});

stage.update();

}
</script>

如果我没记错的话，每当鼠标进入 Canvas 区域时，前面的代码应该使 target_sprite 移动到鼠标的坐标。

但是它不起作用。

图片已绘制，鼠标悬停事件触发，但目标 Sprite 有时会四处移动 - 并移动到意外(随机？)的位置。

如果我将鼠标移动到 target_sprite 的位置，它会移动到左下角(递归地)。而且我没有为 target_sprite 附加鼠标悬停处理程序 - 仅适用于舞台。

是否可以为这样的舞台附加鼠标悬停处理程序？

我可能做错了什么？

Answer 1

我认为你应该使用stagemousemove事件而不是mouseover