Accessing scroll properties in JavaScript

scroll_properties.js

var square = document.getElementById("square");
var content = document.getElementById("content");

/*
* Vertical y-axis properties
*/
square.offsetHeight; //the height in pixels of the scrollable element (e.g. 150px)
square.scrollTop; //the number of pixels from the top that the element is scrolled (e.g. 350px)
content.scrollHeight; //the total height in pixels of the scrollable content (e.g. 500px)

/*
* Horizontal x-axis properties
*/
square.offsetWidth; //the width in pixels of the scrollable element (e.g. 150px)
square.scrollLeft; //the number of pixels from the left that the element is scrolled (e.g. 350px)
content.scrollWidth; //the total width in pixels of the scrollable content (e.g. 500px)