Handling mouse events


show more Handling mouse events provides you with in-depth training on Web. Taught by Ray Villalobos as part of the EaselJS First Look show less
please wait ...

Handling mouse events

Because EaselJS uses JavaScript, any element that is a child of the DisplayObject can have JavaScript properties the track mouse events like onClick and onMouseOver. In this movie, we're going to take a look at how you can take advantage of mouse events with EaselJS. So I've set up a standard HTML file with a canvas tag that has an ID of easel, as well as a JavaScript document that has a canvas, a stage as well as a sprite sheet. I've centered the ship on the stage and set up the animation loop.

If you've got some questions about working with sprite sheets or setting up animations, make sure you check out the movie on using sprite sheets for animation. Once you create a DisplayObject you can perform actions with the object using event handlers. So let's take our ship animation and have it display a different sequence when clicked on. So what we're doing here is creating an event handler on our ship that checks to see if it is being clicked on. If that&...

Handling mouse events
Video duration: 4m 50s 1h 28m Beginner

Viewers:

Handling mouse events provides you with in-depth training on Web. Taught by Ray Villalobos as part of the EaselJS First Look

Subject:
Web
Software:
CreateJS EaselJS
Author:
please wait ...