Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- window.onscroll = function(ev) {
- if ((window.innerHeight + window.scrollY) >= document.body.offsetHeight) {
- // you're at the bottom of the page
- }
- };
- window.onscroll = function(ev) {
- if ((window.innerHeight + window.pageYOffset) >= document.body.offsetHeight) {
- alert("you're at the bottom of the page");
- }
- };
- (window.innerHeight + window.pageYOffset) >= document.body.offsetHeight - 2
- window.onscroll = function(ev) {
- if ((window.innerHeight + window.scrollY) >= document.body.scrollHeight) {
- // you're at the bottom of the page
- console.log("Bottom of page");
- }
- };
- // document.body.scrollTop alone should do the job but that actually works only in case of Chrome.
- // With IE and Firefox it also works sometimes (seemingly with very simple pages where you have
- // only a <pre> or something like that) but I don't know when. This hack seems to work always.
- var scrollTop = (document.documentElement && document.documentElement.scrollTop) || document.body.scrollTop;
- // Grodriguez's fix for scrollHeight:
- // accounting for cases where html/body are set to height:100%
- var scrollHeight = (document.documentElement && document.documentElement.scrollHeight) || document.body.scrollHeight;
- // >= is needed because if the horizontal scrollbar is visible then window.innerHeight includes
- // it and in that case the left side of the equation is somewhat greater.
- var scrolledToBottom = (scrollTop + window.innerHeight) >= scrollHeight;
- // As a bonus: how to scroll to the bottom programmatically by keeping the horizontal scrollpos:
- // Since window.innerHeight includes the height of the horizontal scrollbar when it is visible
- // the correct vertical scrollTop would be
- // scrollHeight-window.innerHeight+sizeof(horizontal_scrollbar)
- // Since we don't know the visibility/size of the horizontal scrollbar
- // we scroll to scrollHeight that exceeds the value of the
- // desired scrollTop but it seems to scroll to the bottom with all browsers
- // without problems even when the horizontal scrollbar is visible.
- var scrollLeft = (document.documentElement && document.documentElement.scrollLeft) || document.body.scrollLeft;
- window.scrollTo(scrollLeft, scrollHeight);
- <!DOCTYPE html>
- <html>
- <head>
- <style>
- div {
- height: 100px;
- border-bottom: 1px solid #ddd;
- }
- div:nth-child(even) {
- background: #CCC
- }
- div:nth-child(odd) {
- background: #FFF
- }
- </style>
- </head>
- <body>
- <div></div><div></div><div></div><div></div><div></div><div></div><div></div>
- <div></div><div></div><div></div><div></div><div></div><div></div><div></div>
- <div></div><div></div><div></div><div></div><div></div><div></div><div></div>
- <div></div><div></div><div></div><div></div><div></div><div></div><div></div>
- <div></div><div></div><div></div><div></div><div></div><div></div><div></div>
- </body>
- <script type="text/javascript">
- console.log("Doc Height = " + document.body.offsetHeight);
- console.log("win Height = " + document.documentElement.clientHeight);
- window.onscroll = function (ev) {
- var docHeight = document.body.offsetHeight;
- docHeight = docHeight == undefined ? window.document.documentElement.scrollHeight : docHeight;
- var winheight = window.innerHeight;
- winheight = winheight == undefined ? document.documentElement.clientHeight : winheight;
- var scrollpoint = window.scrollY;
- scrollpoint = scrollpoint == undefined ? window.document.documentElement.scrollTop : scrollpoint;
- if ((scrollpoint + winheight) >= docHeight) {
- alert("you're at the bottom");
- }
- };
- </script>
- </html>
- var wrapper = document.getElementById('wrapper');
- wrapper.onscroll = function (evt) {
- if (wrapper.scrollTop + window.innerHeight >= wrapper.scrollHeight) {
- console.log('reached bottom!');
- }
- }
- window.onscroll = function(evt) {
- var check = (Element.getBoundingClientRect().bottom - window.innerHeight <= 0) ? true : false;
- if (check) { console.log("You're at the bottom!"); }
- };
- $(document).ready(function(){
- $('.NameOfYourDiv').on('scroll',chk_scroll);
- });
- function chk_scroll(e)
- {
- var elem = $(e.currentTarget);
- if (elem[0].scrollHeight - elem.scrollTop() == elem.outerHeight())
- {
- alert("scrolled to the bottom");
- }
- }
- window.onscroll = function(ev) {
- if ((window.innerHeight + Math.ceil(window.pageYOffset)) >= document.body.offsetHeight) {
- alert("you're at the bottom of the page");
- }
- };
- window.onscroll = function() {
- var scrollHeight, totalHeight;
- scrollHeight = document.body.scrollHeight;
- totalHeight = window.scrollY + window.innerHeight;
- if(totalHeight >= scrollHeight)
- {
- console.log("at the bottom");
- }
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement