Capturing User Input - Beginning HTML5 Games with CreateJS - page 32

Figure 3-1. Alert message when the circle was double-clicked
You can also register for rollover and rollout events on display objects. As you can probably imagine, the legwork
needed to constantly monitor the mouse location and compare it to the position of any display object can be taxing.
Therefore, it should probably be used as sparingly as possible in the Canvas environment. Because of this, EaselJS
doesn't allow this functionality by default. You can turn it on by calling the following method:
stage.enableMouseOver();
After invoking this method on stage, you can now register and properly handle mouseover and mouseout events.
Notice that you can also easily change the cursor of the mouse by using any valid CSS style. Figure 3-2 shows your
circle's alpha value decrease when the mouse is hovering it.
circle.cursor = 'pointer';
circle.addEventListener("mouseover", function (e) {
circle.alpha = 1;
});
circle.addEventListener("mouseout", function (e) {
circle.alpha = .5;
});