Scroll the box below and see the values change.

Explanation: A eventListener is attached to the scroll event. It fires a callback whenever we scroll. Using the function getBoundingClientRect() we are able to determine the top, right, bottom, left values.