Javascript 如何在CreateJS中更改图形的填充颜色
我用它来改变颜色的填充创建js这是不工作的Javascript 如何在CreateJS中更改图形的填充颜色,javascript,createjs,Javascript,Createjs,我用它来改变颜色的填充创建js这是不工作的 var shape_rect = new createjs.Shape(); shape_rect.graphics.beginFill("#FFD64B").drawRect(61, 253, 398, 25); shap_rect3.addEventListener('mouseover', function (evt) { shap_rect3.graphics.beginFill("#FFD64B").drawRect(61, 253,
var shape_rect = new createjs.Shape();
shape_rect.graphics.beginFill("#FFD64B").drawRect(61, 253, 398, 25);
shap_rect3.addEventListener('mouseover', function (evt) {
shap_rect3.graphics.beginFill("#FFD64B").drawRect(61, 253, 398, 25);
stage.update();
});
这里有几件事: 首先,我注意到eventListener链接到shap_rect3,但这还没有定义(至少在您的示例中没有定义)。鼠标盖的颜色也与声明的颜色相同,因此您不会看到任何更改 假设形状3是一个打字错误,这应该对您有用
loadGame = function() {
var canvas = document.getElementById('canvas');
var stage = new createjs.Stage(canvas);
stage.enableMouseOver(); //Enable MouseOver events
var shape_rect = new createjs.Shape(); //Create your shape variable
shape_rect.graphics.beginFill("#FFD64B").drawRect(61, 253, 398, 25); //Draw initial rectangle
shape_rect.on('mouseover', function(evt) { //Change colour on mouseOver
shape_rect.graphics.beginFill("#FF5400").drawRect(61, 253, 398, 25);
stage.update(evt);
});
//Add this if you want to simulate a hover state and return the rectangle back to it's original colour
shape_rect.on('mouseout', function(evt) { //.on gives the same result as .addEventListener (at least from a visual perspective, I'm not sure about resource usage)
shape_rect.graphics.beginFill("#FFD64B").drawRect(61, 253, 398, 25);
stage.update(evt);
});
stage.addChild(shape_rect);
stage.update();
}
我不熟悉createJS和easelJS,但这是实现这一点的一种方法。然后只需运行loadGame函数onLoad:
<body onLoad="loadGame()">
<canvas id="canvas" width="640" height="640"></canvas>
</body>