Javascript 使用jQuery滚动时动态调整div大小

我正在为我的固定标题搜索jQuery解决方案。如果用户向下滚动，标题应以与滚动位置相同的方式收缩，直到达到最小高度

示例：
滚动位置：

0

div高度：

250px

滚动位置：

85

div高度：

165px（=250px-85）

滚动位置：

435

分区高度：

100px（=最小高度）

这是快捷方式

正文{
高度：1000px；
}
.标题{
位置：固定；
背景颜色：浅蓝色；
高度：250px；
宽度：100%；
}

---

---

以下是我的解决方案：

您可以结合使用和

scrollTop（）

函数来实现相同的功能

$(window).scroll(function(){
    var distanceFromTop = $(document).scrollTop();
    if(distanceFromTop < 84 )
    {
        // set div height to 250px
    }   
    else if(distanceFromTop == 85)
    {
        // reduce the div height
    }
    else if(distanceFromTop > 85 && distanceFromTop <= 434)
    {
        // do something with height if required
    }
    else if(distanceFromTop > 434)
    {
        // set div height to 100px
    }   
});

$（窗口）。滚动（函数（）{
var distanceFromTop=$（document.scrollTop（）；
如果（与顶部的距离<84）
{
//将div height设置为250px
}   
else if（距离顶部==85）
{
//降低div高度
}
否则如果（距离顶部>85和距离顶部434）
{
//将div高度设置为100px
}   
});

---

如果您想获得有关js和jQuery的帮助，您至少应该具备js和jQuery的基本知识。因此，它不是为了编写代码，而是为了帮助您解决您在实现中遇到的问题。我确实掌握了基本知识，至少我能够理解代码并做一些小的更改。更重要的是，到目前为止，人们还缺乏理解。很抱歉，到目前为止无法更改此设置：-（是的，这是正确的方法。我唯一想象的是一个平滑褪色的标题，因此js应该计算从顶部开始滚动像素的确切数量并将其移除（当然在再次向上滚动时将其添加回去）。您还可以在CSS中添加transition:all.4s ease；，以获得更好的动画效果。

$(window).scroll(function(){
    var distanceFromTop = $(document).scrollTop();
    if(distanceFromTop < 84 )
    {
        // set div height to 250px
    }   
    else if(distanceFromTop == 85)
    {
        // reduce the div height
    }
    else if(distanceFromTop > 85 && distanceFromTop <= 434)
    {
        // do something with height if required
    }
    else if(distanceFromTop > 434)
    {
        // set div height to 100px
    }   
});