需要实现某个部位吸顶的效果。即,页面往上滑动,刚好到达该部位时,该部分,固定在顶部显示。
在这里插入图片描述
1、监听滚动事件

首先,在mounted钩子中给window添加一个滚动滚动监听事件,

mounted () {
  window.addEventListener('scroll', this.handleScroll)
},

然后在方法methods中,添加这个handleScroll方法

handleScroll () {
 	var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
  	console.log(scrollTop)
 }

根据自身需要在hangleScroll方法中做判断。这里我的是判断页面向上滚还是向下滚

	 handleScroll () {
	   	var oldtop = this.top
		this.top = document.documentElement.scrollTop|| document.body.scrollTop
		if(this.top>=oldtop){
			this.showfirstType = false
		}else{
			this.showfirstType = true
		}
	}
Logo

前往低代码交流专区

更多推荐