vue 计算滚动距离顶部距离改变背景色及文字

最新推荐文章于 2024-05-30 10:22:07 发布

Mr_zrh

最新推荐文章于 2024-05-30 10:22:07 发布

阅读量291

点赞数

文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/Mr_zrh/article/details/132077881

版权

  mounted() {
    window.addEventListener('scroll', this.scrollToTop)
  },
  destroyed() {
    window.removeEventListener('scroll', this.scrollToTop)
  },
  methods: {
    // 计算距离顶部的高度
    scrollToTop() {
      var scrollTop =
        window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
      let that = this
      that.scrollTop = scrollTop
      if (that.scrollTop > 100) {
        ;(that.bgColor = 'white'), (that.fontColor = 'black')
      } else {
        ;(that.bgColor = 'black'), (that.fontColor = 'white')
      }
      console.log(that.scrollTop)
    }
  }```