Explore Programming: DISPLAY ALERT WHEN FOOTER DIV IS DISPLAYED

<!doctype html>
<html lang="en">
 <head>
 <title>Footer display</title>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 <script>
 $(document).ready(function() {
 $(window).scroll(function() {
 console.log("window scrolltop: "+$(window).scrollTop());
 console.log("Footer height: "+$('.footer').offset().top);
 console.log("Window height: "+$(window).height());
 if ($(window).height() >= ( $('.footer').offset().top - $(window).scrollTop() )) {
 console.log('Footer reached!');
 }
 });
 });
 </script>
 <style>
 body { margin: 0; }
 </style>
 </head>
 <body style="padding:10px;padding-bottom:0px;">
 <div>
 pppppppppppppppppp

 pppppppppppppppppp

 pppppppppppppppppp

 pppppppppppppppppp

 pppppppppppppppppp
 </div>
 <div class="footer">
 <h1 style="background-color:pink;">
 Footer
 </h1>
 </div>
 </body>
</html>

Explore Programming

Tuesday, 20 March 2018

DISPLAY ALERT WHEN FOOTER DIV IS DISPLAYED

No comments:

Post a Comment

Infinite scroll on collection page in Shopify

Search This Blog