Html 滚动时如何使div跟随？

我左手边有一个div，包括营业时间和天气。我希望该div根据用户的滚动方式上下滚动。所以它会跟着页面上下移动。我该怎么做呢？这是我的网站

---

谢谢

您可以使用

fixed

CSS position属性来完成此操作。这方面有一个基本教程

编辑：但是，IE版本

---

还有一个黑客，解释道，展示了如何在不影响绝对定位的情况下实现IE6中的固定定位。您将网站定位于哪个版本的IE？

使用CSS中的样式，您可以定义某些内容的定位方式。如果将元素定义为固定的，它将始终保持在屏幕上的相同位置

div
{
    position:fixed;
    top:20px;
}

---

您可以使用css属性Fixed，或者如果需要更精细的调整，则需要使用javascript并跟踪scrollTop属性，该属性定义了用户代理的滚动条位置（0位于顶部，x位于底部）

或者使用jQuery：

$('#ParentContainer').scroll(function() { 
    $('#FixedDiv').css('top', $(this).scrollTop());
});

---

更好的JQuery答案是：

$('#ParentContainer').scroll(function() { 
    $('#FixedDiv').animate({top:$(this).scrollTop()});
});

您还可以在scrollTop之后添加一个数字，即scrollTop（）+5，以使其变为buff

一个好的建议是将期限限制在100年，从违约转向线性宽松

$('#ParentContainer').scroll(function() { 
    $('#FixedDiv').animate({top:$(this).scrollTop()},100,"linear");
})

---

位置：固定property应该做这项工作，我在我的网站上使用了它，效果很好。

---

这篇文章很旧，但我找到了一个完美的CSS，我想与大家分享

粘滞元素根据滚动位置在相对和固定之间切换。它是相对定位的，直到视口中满足给定的偏移位置，然后它“固定”在适当的位置（如位置：固定）

div.sticky{
职位：-webkit sticky；/*Safari*/
位置：粘性；
排名：0；
背景颜色：绿色；
边框：2px实心#4CAF50；
}

---

来源：

follow的可能重复您的意思是它应该跟随鼠标吗？或者，不管滚动，它都应该在屏幕上保持可见？哇，好的，谢谢大家的回答…这个“固定”方法在IE中也有效吗？嗨，很好的解决方案。非常优雅。但对我有效的方法是将javascript版本设置为底部，即将scrolltop值设置为fixed div的底部值。如果为了演示的目的，它是

绝对的

而不是固定的，那该怎么办呢。@Si8将某个元素设置为绝对位置并不能确保该元素在视口中始终可见，因为OP的问题是必需的。我无法让jQuery解决方案工作。请参见@PaulJones，div必须是可滚动的，scroll（）函数才能工作。您可以添加溢出：滚动；在父分区的css中。是！在大多数情况下，这种现代的方法取代了其他的解决方案。伟大而有用的答案——从现在起应该被接受。谢谢，这正是我一直在寻找的

$('#ParentContainer').scroll(function() { 
    $('#FixedDiv').animate({top:$(this).scrollTop()},100,"linear");
})