Здесь всего пара вещей:
Во-первых, я заметил, что eventListener связан с shap_rect3, но это не было определено (по крайней мере, не в вашем примере). Цвет при наведении курсора также совпадает с заявленным цветом, поэтому вы не увидите никаких изменений.
Это должно работать для вас, предполагая, что shap_rect3 был опечаткой.
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>
person
Kieran McClung
schedule
16.05.2014