当用户在页面底部滚动时,Javascript/JQuery执行功能

Chr*_*ski 12 javascript jquery

在一个着名的新闻网站上(sry,不记得究竟是哪一个)我看到了一个非常酷的效果......当你在页面底部滚动时,一个新元素从浏览器视口的顶部向下滑动了很多社交媒体选项(推文,在Facebook上分享等).我想模仿一些类似的东西......事实上,如果我知道如何在用户靠近页面底部时触发一个功能,那么我真的想做很多事情......

所以,我的问题非常基本:当用户在动态大小的页面底部附近滚动时,如何触发一个函数?

Hus*_*ein 31

$(window).scroll(function () {
   if ($(window).scrollTop() >= $(document).height() - $(window).height() - 10) {
      alert('end of page');
   }
});
Run Code Online (Sandbox Code Playgroud)

-10表示在执行函数之前用户必须离页面有多远.这使您可以根据需要灵活地调整行为.

查看http://jsfiddle.net/wQfMx/上的工作示例


ctc*_*rry 8

如果您有一个靠近页面底部的元素,则可以在用户滚动到该元素时使用Waypoints触发函数.或者,如果您想使用Hussein帖子中的像素限制,请务必注意我们从twitter学到滚动课程