JS返回顶部

200 阅读1分钟
js返回顶部

    // 当网页向下滑动 20px 出现"返回顶部" 按钮
    window.onscroll = function () { scrollFunction() };
    function scrollFunction() {
      if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
        document.getElementById("myBtn").style.display = "block";
      } else {
        document.getElementById("myBtn").style.display = "none";
      }
    }

    // 点击按钮,返回顶部
    function topFunction() {
      scrollToptimer = setInterval(function () {
        // console.log("定时循环回到顶部")
        let top = document.body.scrollTop || document.documentElement.scrollTop;
        let speed = top / 4;
        if (document.body.scrollTop != 0) {
          document.body.scrollTop -= speed;
        } else {
          document.documentElement.scrollTop -= speed;
        }
        if (top == 0) {
          clearInterval(scrollToptimer);
        }
      }, 30);
    }