Checks if an element is visible inside another element.

isInsideViewableArea.js

//this code will check if there is any overlap between two elements
//it was made to be used to check if a portion of a scrollably div is visible inside its wrapper
function isInView(containerBB, elBB) {
    return (!(
        elBB.top >= containerBB.bottom ||
        elBB.left >= containerBB.right ||
        elBB.bottom <= containerBB.top ||
        elBB.right <= containerBB.left
    ));
}

//usage
var container = document.getElementById('containerID');
var content = document.getElementById('contentID');

var isVisible = isInView( container.getBoundingClientRect(), content.getBoundingClientRect() );

// based on a solution in http://stackoverflow.com/questions/123999/how-to-tell-if-a-dom-element-is-visible-in-the-current-viewport