jquery - How to hide fixed DIV when footer is visible on screen? -
i have fixed sidebar, visible along page when scrolling down.
the problem - in cases - sidebar getting on footer when reaching bottom of page.
i want hide sidebar when footer visible on screen avoid that. how can it?
try this:
var isscrolledintoview = function(elem) { var $elem = $(elem); var $window = $(window); var docviewtop = $window.scrolltop(); var docviewbottom = docviewtop + $window.height(); var elemtop = $elem.offset().top; var elembottom = elemtop + $elem.height(); return ((elembottom <= docviewbottom) && (elemtop >= docviewtop)); } $(window).on('scroll', function () { $('#sidebar').toggle(!isscrolledintoview('#footer')); });
reference: check if element visible after scrolling
the function called on window scroll , check if footer
visible. if visible, hides sidebar
else shows.
Comments
Post a Comment