jmsardina / html5-canvas-demo

Background

Coordinates Demo
Javascript provides us with multiple functions to track the mouse as it relates to the DOM:

pageX, pageY
offsetX, offsetY
screenX, screenY
clientX, clientY

As you can expect, these all give us different values for mouse coordinates as they use different reference points. This section of the app provides you with a visual representation of how these values relate to the mouse position and to one another.

HTML5 Canvas Scaling Demo
This demo was created as part of a presentation to show the difference between a canvas scaled using HTML height and width attributes as opposed to CSS.

Set Up

• Run

git clone [e-mail]:jmsardina/html5-canvas-demo.git
cd html5-canvas-demo.git
python -m SimpleHTTPServer

• Visit localhost:800