Javascript 用滚动键将div折叠到某个点

我想在用户向下滚动页面时折叠一个div

当用户加载页面时，div的高度为500px，当用户滚动时，div会自动降低其高度，直到达到200px，然后div不再降低高度，一直停留在页面顶部，页面的其他内容在该div下方流动

对不起，我的英语，我的母语是西班牙语

---

非常感谢

您可以使用

.css（）

$（文档）.ready（函数（）{
$（窗口）.on（'scroll'，function（）{
var windowTop=$（window.scrollTop（）；
如果（窗口顶部>500）{
$（'.header'）.css（{'position'：'fixed'，'height'：'200px'}）；
}否则{
$（'.header'）.css（{'position'：'relative'，'height'：'500px'}）；
}
});
});
html，正文{
保证金：0；
填充：0；
}
.内容{
宽度：100%；
高度：200px；
背景色：红色；
颜色：白色；
边框：1px纯黑；
}
.标题{
宽度：100%；
高度：500px；
背景颜色：蓝色；
颜色：白色；
}

标题
@Mohamed Yousef感谢awnser！