JS DOM - 02.05 - Size Cordinates

Element size and Scrolling

Window sizes and Scrolling

Coordinates

To move elements around we should be familiar with coordinates.

Most JavaScript methods deal with one of two coordinate systems:

  1. Relative to the window – similar to position:fixed, calculated from the window top/left edge.

    • we’ll denote these coordinates as clientX/clientY.
  2. Relative to the document – similar to position:absolute 

  3. in the document root, calculated from the document top/left edge.

    • we’ll denote them pageX/pageY.