使用“overflow: auto”滚动 div 的位置

2024-04-16

鉴于这个 HTML 片段:

<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(15px * 10 行)。

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

我手上有简单的 JavaScript 和 jQuery。


您需要使用scrollTop https://developer.mozilla.org/en/DOM/element.scrollTop财产。

document.getElementById('box').scrollTop

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用“overflow: auto”滚动 div 的位置 的相关文章

  • “require(...)”是常见的 JavaScript 模式还是库函数?

    我通常发现这是 node js 脚本 模块以及 phantomJS casperJS 等中的第一行 我很好奇 这是否是服务器端 javascript SSJS 的常见模式 类似于 include在 C C 中或import在 Java 中
  • fadeOut() 和slideUp() 同时进行?

    我已经发现jQuery 淡出然后滑动 https stackoverflow com questions 734554 jquery fadeout then slideup这很好 但不是那个 我怎么能够fadeOut and slideU
  • Javascript:我应该隐藏我的实现吗?

    作为一名 C 程序员 我有一个习惯 将可以而且应该私有的东西设为私有 当 JS 类型向我公开其所有私有部分时 我总是有一种奇怪的感觉 而且这种感觉并没有被 唤起 假设我有一个类型draw方法 内部调用drawBackground and d
  • 非法使用break语句; javascript

    当这个变量达到一定数量时 我希望循环停止 但我不断收到错误 未捕获的语法错误 非法的中断语句 function loop if isPlaying jet1 draw drawAllEnemies requestAnimFrame loop
  • 如何按 Angular 表中的属性(该属性具有单个 rownspan)进行分组?

    我没有找到这个问题的合适标题 我的问题是 例如 我有一个包含两列的表 列汽车品牌和列汽车型号 我希望表是 like in this picture 换句话说 品牌名称只会出现 1 次 我的输入数组采用以下 json 格式 brand Aud
  • JSONP 使用 JQuery 从 HTTPS 协议获取 JSON

    我正在尝试获取从 https 安全站点发送的 JSON 客户端希望不要使用任何服务器端语言 全部都是 Javascript 我读到 当使用 Jquery 中的 ajax 函数时 我必须使用 JSONP 才能从安全站点加载 JSON 我的第一
  • Riak 在 MapReduce 查询中失败。使用哪种配置?

    我正在与 riak riak js 结合开发一个 nodejs 应用程序 并遇到以下问题 运行此请求 db mapreduce add logs run 正确返回存储在存储桶日志中的所有 155 000 个项目及其 ID logs 1GXt
  • 嵌套 DIV 的类似斑马的 CSS 样式

    我嵌套了 DIV 元素 但我不知道嵌套的级别 我需要每个都有与其父级不同的背景 创建类似斑马的颜色 我只使用两种背景 深色和白色 效果需要类似于在容器中设置奇数和偶数子级的样式 但在我的例子中 子级是嵌套的 我可以使用每个嵌套元素的规则来做
  • 中有样式表 吗?

    在内部链接 CSS 文件是一个坏主意吗 body 我读过 如果浏览器在外部找到另一个 CSS 文件 则它会被迫重新开始 CSS 渲染 head 只是因为它可能需要将样式应用于已经渲染的元素 另外 我认为 HTML 无法正确验证 我需要确认这
  • D3 向对象添加超链接?

    我正在尝试制作 D3 图 它将代表我网站的菜单 我尝试按照此处的其他指南添加超链接 但它们都不起作用 每个对象都会有一个不同的 URL 指向 主页 关于 联系方式等 如果添加超链接 我可以拖动对象吗 这意味着如果我按住单击 如果我单击该对象
  • CSS 标签“object-fit:cover”不会在 Chrome 中裁剪/剪辑视频

    CSS tag object fit cover无法按预期在 Chrome 中剪辑 裁剪视频 这种情况仅适用于视频且仅在 Chrome 中发生 图像在 Chrome 中正常 在所有其他经过测试的浏览器中 图像和视频都工作正常 The beh
  • 使 Bootstrap Popover 在悬停而不是单击时出现/消失

    我正在使用 Bootstrap 构建一个网站Popover http twitter github com bootstrap javascript html popovers我不知道如何使弹出窗口出现在悬停而不是单击时 我想做的就是当有人
  • for循环中需要声明变量吗?

    有什么区别 for var i 0 i lt 5 i for i 0 i lt 5 i 是否有必要包含 var 关键字 我知道 var 关键字会影响变量范围 但我无法理解是否有必要在 for 循环中包含该关键字 在第二个示例中 您的变量是全
  • 在javascript中创建图像的缩略图方块(不丢失纵横比)

    我正在制作一个客户端拖放文件上传脚本作为书签 在上传之前 我使用 File API 将图像读取为 base64 格式并将其显示为缩略图 This is how my thumbnails look like I want them to l
  • Vue-Router 抽象父路由

    我正在尝试将当前网站迁移到 vuejs 站点地图必须是 login signup password reset browse search dozens of other routes 由于其中一些路线共享大量 fx 因此我将它们设为父路线
  • 如何使用 javascript 更改文件扩展名

    有谁知道在 Javascript 中更改文件扩展名的简单方法吗 例如 我有一个带有 first docx 的变量 但我需要将其更改为 first html 这将改变字符串包含文件名 let file first docx file file
  • 使用ExternalInterface和IE从JavaScript获取Flash中的当前URL

    我正在尝试获取 Flash 播放器当前所在的 URL 不是 swf 文件的 URL 而是浏览器指向的 URL 到目前为止我已经使用过 var st String ExternalInterface call window location
  • Jquery 以编程方式更改

    文本

    编辑 解决方案是将其添加到个人资料页面而不是性别页面 profile live pageinit function event p pTest text localStorage getItem gender 我在列表视图中有一个带有一些文
  • 区分 NaN 输入和输入类型为“number”的空输入

    我想使用 type number 的表单输入 并且只允许输入数字
  • 使用溢出支持定位粘性填充材料[重复]

    这个问题在这里已经有答案了 我在用position sticky在我的应用程序中 在使用overflow属性来显示滚动条 我已经寻找了一个确实支持这种情况的polyfill 但到目前为止没有任何运气 有谁知道这样的polyfill shim

随机推荐

  • 在 C++ 和 Java 中声明对象

    我已经使用c 有一段时间了 我正在学习java 在java中声明对象让我很困惑 在java中我们写 myclass myobject new myclass myobject mymethod 和c 中的这段代码一样吗 myclass my
  • D3JS:将时间序列数据中缺失的时间值插入为空

    我正在尝试使用 D3 绘制时间序列数据 但遇到了缺少时间戳和宽度调整的问题 数据通常每 5 分钟发布一次 但由于某种原因有时可能没有时间戳 例如 上午 11 45 之后 下一个时间戳将为 23 45 我想在中间有一个间隙 而不是在该时间段内
  • 正则表达式允许除空格或所有空格之外的任何内容? [复制]

    这个问题在这里已经有答案了 我想允许任何事情和一切 除了空白条目 NULL 零字符 无论你想怎么称呼它 以及任何长度的空格之外 都不应该允许 如果我使用某种语言进行编码 这本质上就是我使用 TRIM 函数所做的事情 但我需要仅使用正则表达式
  • 在 PHP 中读取 REST API 响应

    我正在尝试阅读 Raven SEO Tools API 它是一个 REST API 目前当我通过 Web 浏览器请求 URL 时 它以 XML 或 JSON 如果我选择 的形式提供数据备份 将他们的服务器的响应获取到我自己的 PHP 脚本中
  • 如何在 Perl 中同时迭代多个列表?

    我需要创建一个文本文件 aptest s 我可以用它来读入另一个程序 我使用 Perl 是因为我有一个很大的列表需要处理 我的代码如下 没有给出所需的输出 在代码和实际输出之后显示 任何帮助 将不胜感激 usr bin perl w chd
  • Ruby on Rails:如何使用迁移向现有列添加非空约束?

    在我的 Rails 3 2 应用程序中 我的数据库中有一堆表 但我忘记添加一些非空约束 如何编写将 not null 添加到现有列的迁移 您还可以使用更改列空 http api rubyonrails org classes ActiveR
  • 如何使用反射设置属性值

    我有一个用属性装饰的类 DataEntity MESSAGE STAGING EnableCaching true CacheTimeout 43200 对于某些要求 我想改变这个值MESSAGE STAGING在运行时到Test Mess
  • Eclipse 中是否有键盘快捷键可以折叠当前方法/块?

    问题说明了一切 我在 Eclipse v3 4 中打开了折叠功能 并且不必单击页面装订线中的小 我想知道是否有一个键盘快捷键 折叠当前方法 快速浏览一下 Eclipse 中的菜单和其他内容不会显示它的菜单项 所以也许您无法做到这一点 Any
  • SEO URL 重写 ASP.NET

    我已经有一个 ASP NET 网站 我想更改我的网站 使其对 SEO 网址更加友好 我想改变前任这个网站 www mydomain aspx articleID 5 到 www mydomain article learningURLrew
  • WiX 无法正确渲染图像

    我正在尝试编写一个自定义 WiX 对话框 作为其工作流程的一部分 它会根据某些条件显示错误图像 然而 WiX 似乎忽略了我的尺寸并按其感觉合适的方式显示 这是我的代码
  • 一起使用 MongoDB 和 Neo4j

    我正在开始一个新项目 我正在考虑使用 MongoDB 作为文档存储工具 使用 Neo4j 作为映射文档之间关系的机制 然后我想通过 REST API 公开查询结果 人们会说这样做的优点和缺点是什么 是否有更好的方法可以使用不同的 NoSQL
  • “无法从...初始化默认 wsdl”——为什么?

    My pom xml包含以下内容 用于自动为具有以下指定 WSDL 的工作 Web 服务生成客户端
  • 在bash中生成不重复的随机数序列

    今晚我一直在忙着学习 bash 我一直在尝试创建一个随机数字序列 该序列使用一个范围内的所有数字 并且每个数字只使用一次 因此 输入 1 5 的范围将输出 4 3 5 2 1 或 2 5 1 3 4 等 我在这件事上陷入了困境 Thanks
  • WordPress - 在侧边栏“最近的帖子”中显示特定类别的帖子

    如何使 WP 侧边栏中的 最近帖子 仅显示特定类别的帖子 使用 Otto 的 php 代码小部件之一制作您自己的最近帖子小部件可能是最简单的http wordpress org extend plugins php code widget
  • 如何使用 python 处理 dbus 接口的属性?

    我即将致力于实施mpris http mpris org 但目前我不知道如何使用 python dbus 读取 写入 dbus 接口属性 有这方面的例子吗 终于得到了答案 dbus service method dbus PROPERTIE
  • CSS 缩放不是模糊而是像素化

    我想在图像的 CSS 中使用缩放属性 但不希望对放大的图像产生模糊效果 而是像素化 我怎样才能实现这个目标 编辑 如果需要 可以使用其他属性或其他语言 您 当前 不能使用放大并指定浏览器应使用最近邻缩放 无论是 HTML 图像 放大的 HT
  • Javascript - 捕获对对象属性的访问[重复]

    这个问题在这里已经有答案了 是否可以捕获对象的 任何 属性被访问或尝试访问的时间 Example 我已经创建了自定义对象Foo var Foo function var self set a few properties return se
  • 将表行变成 Rails 中的链接

    我正在尝试在表中创建一行链接到编辑页面 我知道正在创建链接 因为我可以将它们打印出来 我很接近 但缺少一些重要的东西 我需要更改什么才能使链接正常工作 h1 Scouts h1 p p div class message board tab
  • PHP 时区 getTransitions 值得信赖吗?

    您是否曾经遇到过通过 getTransitions 函数进行 PHP 时区转换的任何问题 我正在尝试将阿根廷日期转换为 GMT 如果我查看转换数组 我会得到 63 gt Array ts gt 1287284400 time gt 2010
  • 使用“overflow: auto”滚动 div 的位置

    鉴于这个 HTML 片段 div style 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 b