Determine Above the fold easily
A Snippet which is very handy, is to determine, if something is above the fold AND also within the viewable area. Above the fold does not necessarily mean – visible.
var element = jQuery("#canvas"); var pageTopValue = element.offset().top + element[0].scrollHeight; var viewable = jQuery(window).scrollTop()+ jQuery(window).height(); if( jQuery(window).scrollTop() > pageTopValue ){ console.log( "Element hidden (above viewable area)" ); } else if( viewable < element.offset().top ){ console.log( "Element hidden (below viewable area)" ); } else{ console.log( "Element visible! (within viewable area)" ); } |