vue实现点击按钮页面滚动至指定位置

var heightFlag = false//全局变量
clickQuotation() {
    if (this.heightFlag) return
      const orangeHeight = window.pageYOffset//点击事件后,页面移动至页面左上角的距离,现在为0(顶部);const orangeHeight = window.pageYOffset-100(指距顶部下移100)
      								//
      let i = 0
      this.heightFlag = true
      this.interval = setInterval(() => {
        const next = Math.floor(this.heightChange(10 * i, orangeHeight, -orangeHeight, 500))
        if (next <= 0) {
          window.scrollTo(0, 0)//第二个0表示滚动距离
          clearInterval(this.interval)
          this.heightFlag = false
        } else {
          window.scrollTo(0, next)
        }
        i++
      }, 16.7)
    },
    heightChange(t, b, c, d) {
      if ((t /= d / 2) < 1) return c / 2 * t * t + b
      return -c / 2 * (--t * (t - 2) - 1) + b
    }
Logo

前往低代码交流专区

更多推荐