Skip to content

Instantly share code, notes, and snippets.

@cladley
Created May 27, 2016 15:49
Show Gist options
  • Save cladley/858de548e609401b73cb2f784e608e54 to your computer and use it in GitHub Desktop.
Save cladley/858de548e609401b73cb2f784e608e54 to your computer and use it in GitHub Desktop.
var docElem = window.document.documentElement;
function getViewportH() {
var client = docElem['clientHeight'],
inner = window['innerHeight'];
if( client < inner )
return inner;
else
return client;
}
function scrollY() {
return window.pageYOffset || docElem.scrollTop;
}
// http://stackoverflow.com/a/5598797/989439
function getOffset( el ) {
var offsetTop = 0, offsetLeft = 0;
do {
if ( !isNaN( el.offsetTop ) ) {
offsetTop += el.offsetTop;
}
if ( !isNaN( el.offsetLeft ) ) {
offsetLeft += el.offsetLeft;
}
} while( el = el.offsetParent )
return {
top : offsetTop,
left : offsetLeft
}
}
function inViewport( el, h ) {
var elH = el.offsetHeight, // Heght of element
scrolled = scrollY(), // How much the window has scrolled
viewed = scrolled + getViewportH(), // whats in view = how much we have scrolled + height of viewport
elTop = getOffset(el).top,
elBottom = elTop + elH,
// if 0, the element is considered in the viewport as soon as it enters.
// if 1, the element is considered in the viewport only when it's fully inside
// value in percentage (1 >= h >= 0)
h = h || 0;
return (elTop + elH * h) <= viewed && (elBottom - elH * h) >= scrolled;
}
inViewport("Some Div Element", 1);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment