Fatal编程技术网

Javascript 滚动事件故障

javascript events

Javascript 滚动事件故障,javascript,events,frontend,Javascript,Events,Frontend,我想制作一个脚本，使id为header的div在滚动时变薄，回到页面顶部时变厚。但是我遇到了一个问题：当我向下滚动时，页眉变得越来越薄，但是当我回到页面的顶部时，它并没有变得更厚，而且如果你把网页重新加载到中间的某个地方，然后你就到了上面，页眉 >只有一次变厚。 我做错了什么 var head=document.getElementById（'header'）； var高度=100； var sourceCoord=head.getBoundingClientRect（）.top+window

我想制作一个脚本，使id为
header的
div
在滚动时变薄，回到页面顶部时变厚。但是我遇到了一个问题：当我向下滚动时，<代码>页眉变得越来越薄，但是当我回到页面的顶部时，它并没有变得更厚，而且如果你把网页重新加载到中间的某个地方，然后你就到了上面，<代码>页眉 >只有一次变厚。

我做错了什么



var head=document.getElementById（'header'）；
var高度=100；
var sourceCoord=head.getBoundingClientRect（）.top+window.pageYOffset；
变量id；
document.addEventListener（“滚动”，函数（）{
if（window.pageYOffset>sourceCoord）{
id=setInterval（函数（）{
如果（高度==50）清除间隔（id）；
否则{
高度--；
head.style.height=高度+px；
}
}, 10);
head.style.position='fixed'；

}否则，如果（window.pageYOffset，问题是在页面加载时计算
sourceCoord
，而它在滚动时实际会发生变化。将其包含在滚动侦听器中，您应该会很好