clientY vs pageY

Edit this page

Given a point in the page, clientY and pageY are the distances in pixels from the point to the top of viewport and page.

Here, page is the whole rendered page which may have the scrollbars, whereas viewport is the visible part of the page.

┌─────────────────────────────┬─┐◀︎─── Web page      ▲
|                             | |                   |
|                             | |                   |
|                             | |                   |
|                             | |                   |
|                             | |                   |
|                             | |                   |
|                             | |                 pageY
|                             | |                   |
├=============================┼─┤       ▲           |           ▲
|                             | |       |           |           |
|                             | |       |           |           |
|       Scroll bar ──────────▶︎| |       |           |        clientY 
|                             | |     Browser       |           |
|                             | |     window        |           |
|       ● Point               | |       |           ▼           ▼
|                             | |       |
|                             | |       |
├=============================┼─┤       ▼
|                             | |
|                             | |
|                             | |
└─────────────────────────────┴─┘

clientHeight vs offsetHeight vs scrollHeight

← clientHeight vs offsetHeight vs scrollHeight

concat vs push →

Hit the Subscribe button for the latest news on my tools. No spam. Ever!

clientY vs pageY

More

Products

Resources

Follow me