使用“溢出：自动”滚动div的位置

Posted 2023-03-10

【中文标题】使用“溢出：自动”滚动div的位置

【英文标题】：Scroll Position of div with "overflow: auto"

【发布时间】：2010-09-25 13:39:04

【问题描述】：

鉴于此 html sn-p：

<div id="box" style="overflow:auto; width:200px; height:200px; border:1px solid black;">
1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br>10<br>
11<br>12<br>13<br>14<br>15<br>16<br>17<br>18<br>19<br>20<br>
21<br>22<br>23<br>24<br>25<br>26<br>27<br>28<br>29<br>30<br>
</div>

您（通常）会得到一个带有滚动条的黑框，其中包含数字 1 到 30，每个数字都在一个新行中。

您可以在该框内上下滚动。

我现在需要的是找出盒子在哪个滚动位置的可能性。假设每行 15 像素高，向下滚动到数字 10，我想要得到的结果是数字 150（15 像素 * 10 行）。

我在哪里可以找到这个号码？

我手头有纯 javascript 和 jQuery。

【参考方案1】：

您需要使用scrollTop 属性。

document.getElementById('box').scrollTop

【讨论】：

太棒了。这正是我一直在寻找的。​​span>

出于好奇，它与 jQuery 的 .scrollTop() 有什么不同吗？

从 scrollTop() 源代码来看，我认为没有区别