vue实现吸顶的效果


export default {
  name: "nav-bar",
  data() {
    return {
      isFixed: false, //当滚动条高度大于152时是否定位
      scrollHeight: 152
    };
  },
  mounted() {
    window.addEventListener("scroll", this.initHeight);
  },
  methods: {
    // 实现吸顶效果,判断滚动条距离顶部的距离
    initHeight() {
      let scrollTop =
        window.pageYOffset ||
        document.documentElement.scrollTop ||
        document.body.scrollTop;
      this.isFixed = scrollTop > this.scrollHeight ? true : false;
    }
  },
  destroyed() {
    window.removeEventListener("scroll", this.initHeight, false);
  }
};

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM