css垂直滚动为固定div

时间:2012-08-16 16:53:40

标签: jquery css scroll css-position

我有一个div,让我们说

height:2000px 

width: 30px

我需要确定其位置

然而当我使用

position: fixed

然后虽然div始终可见,但我无法垂直滚动以查看“溢出”内容

我找到了这个插件: https://github.com/bigspotteddog/ScrollToFixed

但它仅适用于水平滚动。

任何想法我能做什么???

2 个答案:

答案 0 :(得分:0)

您需要使用javascript执行此操作。如果你看一下你提到的插件的来源,你会看到它存储目标元素的偏移并根据水平滚动位置设置它的左边位置;这意味着它正在实施自己的“固定”功能。

基本上,如果水平滚动位于200,则将目标向左移动200.您可以垂直而不是水平地执行此操作。

每次滚动窗口(绑定到window.scroll事件),检查垂直位置,然后沿垂直滚动位置向相反方向(向上)移动元素,将其保持在开始位置。这将使它看起来好像是固定的。

如果您对插件的来源有任何疑问,请查看该插件的来源:

https://github.com/bigspotteddog/ScrollToFixed/blob/master/jquery-scrolltofixed.js

编辑:我应该说,覆盖固定功能。使目标元素固定,然后根据垂直滚动位置调整其垂直位置,如上所述。

答案 1 :(得分:0)

我会说尝试position: absolute; Fix将使元素的位置保持不变。使用absolute“元素相对于其第一个定位(非静态)祖先元素的位置”时,请检查w3schools here