当页面滚动时，如何动态切换布局/样式 1. 添加滚动事件的监听/注销 2. 在state中添加参数，滚动页面时更新数据 更新参数后，设置样式。可以直接更新样式，也可以动态修改className然后在css文件中添加动态样式。 vi设计http ...

以下是常见的监听滚动以及相应的操作 窗口滚动事件 当页面滚动时，如何动态切换布局/样式 1. 添加滚动事件的监听/注销 2. 在state中添加参数，滚动页面时更新数据 更新参数后，设置样式。可以直接更新样式，也可以动态修改className然后在css文件中添加动态样式 ...

　　不知大家在前端开发实践中有没有做过这样一个效果，就是页面布局中有一个顶部通栏的搜索登录框，我们的需求就是当鼠标向下滚动时，顶部通栏始终固定在顶部，并且默认顶部是透明背景，而当页面滚动时，顶部通栏的透明度随着页面卷曲的高度增加而变大，当页面滚动距离超过某一个高度时，透明度就固定不变了。顶部通栏 ...

说明：因为监听是针对window的，所以增加监听后每个页面都会监听，只对某个页面进行监听的话需要在destroyed中将监听移除 ...

监听页面滚动事件 window.onscroll 获取页面滚动高度 document.documentElement.scrollTop 在桌面端可用，在移动端值一直为0 document.body.scrollTop 在移动端可用，在桌面端一直为0 说明移动端滚动 ...

　　不知大家在前端开发实践中有没有做过这样一个效果，就是页面布局中有一个顶部通栏的搜索登录框，我们的需求就是当鼠标向下滚动时，顶部通栏始终固定在顶部，并且默认顶部是透明背景，而当页面滚动时，顶部通栏的透明度随着页面卷曲的高度增加而变大，当页面滚动距离超过某一个高度时，透明度 ...

html结构： 在mounted事件中监听滑动事件 可以添加销毁事件 在methods中定义一个方法 ...

监听页面滚动 在methods中定义一个方法 handleScroll () { html中 在mounted监听 最后要销毁这个监听要不然会在其他的页面中 执行 报错 ...