The Mouse and the Canvas

We'll cover the following...

Often times, the canvas seems like its own mysterious beast. It is not until you run into areas like events that aren’t specific to the canvas where you realize that all of this is just a small part of this larger JavaScript enclosure. For the next few sections, you are going to be learning general JavaScript 101 stuff about events, so feel free to skip or gloss over the material if you are intimately familiar with dealing with mouse events.

Meet the Events

Our canvas element works with all the mouse events that your browser exposes:

  • click
  • dblclick
  • mouseover
  • mouseout
  • mouseenter
  • mouseleave
  • mousedown
  • mouseup
  • mousemove
...