Working with Sprite

[Home] > Working with Sprite

This content we learn how to work with a sprite.

Create the sprite animation

You can create the sprite animation with the motion5 package.

import {element5 as $, motion5} from '@bapquad/element5'

let number = motion5.Sprite(100, 100, "number.png");

Create the DOM element.

You need the DOM element to role the playback for the animation.

let player = $.create("p#number").motion(number);

Now, the animation will play on the "Play" button clicked.

let playBtn = $.create("button").text("Play").on("click", () => {
  player.MotionSprite.Run();
});