Content Size vs. Window Size

A bit of javascript and jquery to compare the height of the page content vs. the height of the window. In this case, I’m adding a class to another class if the content is shorter.


// if the content of the page is less than the height of the window...
if (document.body.scrollHeight < document.documentElement.clientHeight)
{
$(".foot-wrap").addClass("shortpage");
}

update: I had to change it from comparing the body.scrollHeight to a just a class on the page. Google Chrome would considered the body height the same as the client height if it was shorter. Here’s what I used.


// if the content of the page is less than the height of the window...
if (document.getElementsByClassName('container')[0].scrollHeight < document.documentElement.clientHeight)
{
$(".foot-wrap").addClass("shortpage");
}