getBoundingClientRect()

Click this paragraph to read its getBoundingClientRect().left/top

1. Zoom in a bit. (Not really required, but it makes the tests easier to follow.
2. Click on the paragraph. You’ll see its current offset.
3. Scroll down a little bit until the top of the paragraph is just off-screen. Click again.
4. If you now see a negative number it’s relative to the VISUAL VIEWPORT.
5. If you still see the same number, scroll all the way down the page. Then scroll up until the paragraph is barely visible. DO NOT scroll up entirely to the top of the page.
6. Click the paragraph again. If the number is still the same, it’s relative to the DOCUMENT (which is an old-fashioned way of saying layout viewport).
7. If the number is different it’s relative to the LAYOUT VIEWPORT (modern definition).