Question

使用EaselJS时，如何为画布设置光标？

经过大量调试后，我设法找出了有问题的代码：stage.enableMouseOver()。我正在使用stage.enableMouseOver()，因为我需要能够将鼠标悬停在舞台上放置的各种元素上。但是，我发现随后尝试为画布设置光标无法执行任何操作。 stage.canvas.style.cursor = "text"除了stage.cursor = "text"之外什么也没做。但是，stage.canvas.style.cursor在注释stage.enableMouseOver()时有效。

这不起作用：

＆＃13;

var stage = new createjs.Stage("canvas");

stage.enableMouseOver(); // comment out this line to get it to work

$("button").click(function() {
  stage.canvas.style.cursor = "text";
});

＆＃13;

<script src="https://code.createjs.com/easeljs-0.8.1.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<button id="change-cursor">
  Use text cursor instead of default
</button>
<br>
<canvas id="canvas" width=100 height=100 style="background-color:whitesmoke"></canvas>

＆＃13;

如何在不删除stage.enableMouseOver()的情况下显示所选光标？

可行的示例，但注释掉stage.enableMouseOver()：

＆＃13;

var stage = new createjs.Stage("canvas");

// stage.enableMouseOver();

$("button").click(function() {
  stage.canvas.style.cursor = "text";
});

＆＃13;

<script src="https://code.createjs.com/easeljs-0.8.1.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<button id="change-cursor">
  Use text cursor instead of default
</button>
<br>
<canvas id="canvas" width=100 height=100 style="background-color:whitesmoke"></canvas>

＆＃13;

Answer 1

EaselJS中有$claim.comment个属性，请查看以下示例：

cursor

var stage = new createjs.Stage("canvas");
stage.cursor = 'text';
  
var bgShape = new createjs.Shape();
bgShape.graphics.beginFill("red").drawRect(0, 0, 100, 100);
stage.addChild(bgShape);

stage.enableMouseOver();

#canvas {
  cursor: text;
}

Answer 2

对于使用Animate CC的用户，请在启用鼠标之前设置光标：

stage.cursor="pointer";
stage.enableMouseOver(20);

如何在启用鼠标悬停的情况下在EaselJS中设置光标？

2 个答案: