javascript - 用户点击页面底部时的Jquery

Question

我一直在为我的网站开发滚动到顶部的功能，这部分工作正常。然而，我的问题是我有一个固定的 div，当它到达页面底部时，它与我的页脚重叠。

这是我工作的功能。

$(document).scroll(function (e) {
  if (document.body.scrollTop >= 800) {
    $('#beamUp').show(1000);
         } else {
    $('#beamUp').hide(1000);
    return false;
  }  
});

当我点击页面的那部分并阻止 div 移动过去时，我是否可以检测到。非常感谢帮助！

jsFiddle：http: //jsfiddle.net/zazvorniki/RTDpw/

Answer 1

只需获取页面高度，减去相关 div 的高度以及页脚...确保顶部永远不会大于该值...您还需要一个 onresize 事件处理程序重新评估那个值。

---

看着你的 jsfiddle ......这是我的编辑

在您的滚动监听器中，我正在检查页面的位置，并适当调整浮动的底部位置。我还设置了初始显示：无，因此您无需在初始脚本中调用 .hide()。另外，调整窗口大小有滚动的效果供你使用，所以我改变了这两个事件的监听器。

$(document).on('scroll resize', function (e) {
  var viewHeight = $(window).height();
  var viewTop = $(window).scrollTop();
  var footerTop = $("footer").offset().top;
  var baseline = (viewHeight + viewTop) - footerTop;
  var bu = $("#beamUp").css({bottom: (baseline < 0 ? 0 : baseline) + 'px'});

  if (viewTop >= 50) {
    bu.show(1000);
  } else {
    bu.hide(1000);
  }
});