js回到顶部，带过渡动画效果

先来看看实现的效果：

js点击回到顶部添加过渡动画效果

这里我就直接贴js代码了，html代码我就不写了，就是回到顶部按钮的一个点击事件，我用的vue,this.myTimer是data函数里面的一个变量，你可以自己声明一个变量，主要是用做定时器的
代码如下:

toTop() {
      // 返回顶部,添加过度动画，如果下拉距离超过10000，就统一0.8秒回到顶部，否则按默认速度
      // 如果想要过渡事件长一点就把下面的80加大，否则减小
      let scrollTo = document.documentElement.scrollTop;
      if (this.myTimer == -1) {
        if (scrollTo > 10000) {
          let num = (scrollTo / 80).toFixed(0);
          this.myTimer = setInterval(() => {
            scrollTo -= num;
            if (scrollTo <= 0) {
              scrollTo = 0;
              window.clearInterval(this.myTimer);
              this.myTimer = -1;
            }
            window.scrollTo(0, scrollTo);
          }, 10);
        } else {
          this.myTimer = setInterval(() => {
            scrollTo -= 100;
            if (scrollTo <= 0) {
              scrollTo = 0;
              window.clearInterval(this.myTimer);
              this.myTimer = -1;
            }
            window.scrollTo(0, scrollTo);
          }, 10);
        }
      }
    },