Javascript 淡出与偏移位置相关的div

我想在向下滚动时淡出与滚动相关的Div，不透明度淡出，向上滚动时淡出

CSS:

.mg{
边缘顶部：100px；
高度：414px；
位置：固定；
宽度：100%；}
#英雄{
不透明度：1；
}

HTML:

例
例

JavaScript:

var-hero，yPos；
函数yScroll（）{
pagetop=document.getElementById（'hero'）；
yPos=window.pageYOffset；
如果（yPos>150）{
hero.style.opacity=“0”；
}否则{
hero.style.opacity=“1”；
}
};

什么也没发生

---

这里有人能告诉我哪里出了问题吗

我在这里解决了几个问题

1-您使用了未初始化的变量hero，您使用了错误的名称

hero=document.getElementById（'hero'）；

而不是

pagetop=document.getElementById（'hero'）；

2-Id是区分大小写的，因此Id=“hero”不是“hero”

3-您从未调用javascript函数。我在scroll上添加了一个调用

$（文档）.on（'scroll'，function（）{
yScroll（）；
}) 

还要注意的是，on scroll并不仅仅意味着移动鼠标滚轮或箭头键，它还意味着实际拥有页面滚动。如果你想在不滚动的情况下点击鼠标滚轮或箭头，你必须捕获这些事件并调用你的函数，你可以链接你的网站或在JSFIDLE中插入代码吗？这是整个项目，我不太明白你想做什么，你能给我解释一下你想要的功能是什么吗？我想做的就是在这个网站上：在英雄部分淡入淡出退场。。！