一个前端,爱跑步、爱吉他、爱做饭、爱生活、爱编程、爱南芳姑娘,爱我所爱。世间最温暖又无价的是阳光、空气与爱,愿它们能带你去更远的地方。

  • 文章
  • 心情
  • 照片墙
  • 工具
  • 开发技术分享

    浏览器触底判断(添加防抖)

    技术 197 2020-12-18 16:48

    废话不多说,直接上代码!

    function moveToBrowserBottom() {
      let timerForDebounce = null; //为了防抖添加的timer
      window.onscroll = function() {
        if (timerForDebounce) clearTimeout(timerForDebounce);
        var scrollTop =
          document.documentElement.scrollTop ||
          window.pageYOffset ||
          document.body.scrollTop;
            // gap是为了计算偏差,有时候会有1px的偏差值
        let gap =
          Math.ceil(document.documentElement.clientHeight + scrollTop) -
          document.documentElement.scrollHeight;  
        if (
          document.documentElement.scrollHeight ===
            Math.ceil(document.documentElement.clientHeight + scrollTop) ||
          gap === 1
        ) {
          timerForDebounce = setTimeout(() => {
            console.log("触底了");
          }, 200);
        }
      };
    }