Tracking mouse movement


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

Tracking mouse movement

When building games and interactive projects, you often need to worry about controlling movies with the mouse. Let's take a look at how EaselJS lets you access the mouse movement on the stage. We'll take a bitmap animation and have it follow the mouse, add friction to the mouse movement and orient a bitmap to the mouse position. My HTML and JavaScript files are setup like what we ended up with on the video on using sprite sheets for animation. So if you have any questions about how to work with bitmap animations, you may want to check out that movie. We have a standard HTML file with a canvas tag, as well a JavaScript document with a canvas variable, a stage, a sprite sheet and a bitmap animation.

The ship is currently centered on screen and unfortunately immediately set to explode. So if I refresh this window right here, you'll see that it's showing the explosion part of the animation. So I'll switch that out to the flying part of the animation right here....

Tracking mouse movement
Video duration: 3m 55s 1h 28m Beginner

Viewers:

Tracking mouse movement 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 ...