From 2d61dac1efd48edc8ab95e8c114a7edccc02362d Mon Sep 17 00:00:00 2001 From: allo Date: Mon, 29 Jul 2024 11:36:03 +0800 Subject: [PATCH] minor fixes --- .../zh-cn/web/api/element/scrolltop/index.md | 35 +++++++++---------- 1 file changed, 16 insertions(+), 19 deletions(-) diff --git a/files/zh-cn/web/api/element/scrolltop/index.md b/files/zh-cn/web/api/element/scrolltop/index.md index d629f50338f9a1..92a86611bb4f5b 100644 --- a/files/zh-cn/web/api/element/scrolltop/index.md +++ b/files/zh-cn/web/api/element/scrolltop/index.md @@ -1,27 +1,29 @@ --- -title: Element.scrollTop +title: Element：scrollTop 属性 slug: Web/API/Element/scrollTop +l10n: + sourceCommit: d80aa2a5a8ef9c2134c39bc48e0e8b0807afc39b --- -{{ APIRef("DOM") }} +{{APIRef("DOM")}} -`Element.scrollTop`属性可以获取或设置元素内容从其顶部边缘滚动的像素数。在现代浏览器中，该值是亚像素精度的，这意味着它不一定是一个整数。 +**`Element.scrollTop`** 属性可以获取或设置元素内容从其顶部边缘滚动的像素数。在现代浏览器中，该值是亚像素精度的，这意味着它不一定是一个整数。 ## 值 -一个双精度浮点值，表示元素当前从原点垂直滚动的像素数，其中正值表示元素向下滚动（以向底部显示更多内容）。如果元素根本没有向上或向下滚动，则`scrollTop`为 0。如果文档不是活动文档，则返回值为 0。如果文档在亚像素精度设备上呈现，则返回的值也是亚像素精度的，可能包含小数部分。 +一个双精度浮点值，表示元素当前从原点垂直滚动的像素数，其中正值表示元素向下滚动（以显示更多底部的内容）。如果元素根本没有向上或向下滚动，则 `scrollTop` 为 0。如果文档不是活动文档，则返回值为 0。如果文档在亚像素精度设备上呈现，则返回的值也是亚像素精度的，可能包含小数部分。 -如果元素可以从初始包含块向上滚动，则`scrollTop`可能为负。例如，如果元素的{{cssxref("flex direction")}}是`column-reverse`，并且内容向上增长，那么当滚动条位于其最底部位置（在滚动内容的开始处）时，`scrollTop`为`0`，然后当你向内容末尾滚动时，scrallTop 逐渐变负。 +如果元素可以从初始包含块向上滚动，则 `scrollTop` 可能为负。例如，如果元素的 {{cssxref("flex-direction")}} 是 `column-reverse`，并且内容向上增长，那么当滚动条位于其最底部位置（在滚动内容的开始处）时，`scrollTop` 为 `0`，然后当你向内容末尾滚动时，其值逐渐向负方向增长。 -Safari 通过将`scrollTop`更新到最大滚动位置之外来响应过度滚动（除非禁用默认的“反弹”效果，例如将{{cssxref("overscroll-behavior")}}设置为`none`），而 Chrome 和 Firefox 则不会。例如，在 Safari 浏览器上，当元素已经位于顶部时继续向上滚动，`scrollTop`可能会变为负值。 +Safari 通过将 `scrollTop` 更新到最大滚动位置之外来响应过度滚动（除非禁用默认的“反弹”效果，例如将 {{cssxref("overscroll-behavior")}} 设置为 `none`），而 Chrome 和 Firefox 则不会。例如，在 Safari 浏览器上，当元素已经位于顶部时继续向上滚动，`scrollTop` 可能会变为负值。 -通过设置 scrollTop 属性，可以让元素在垂直方向滚动到指定位置，和使用{{domxref("Element.scroll()")}}设置`behavior: "auto"`效果一致。 +通过设置 `scrollTop` 属性，可以让元素在垂直方向滚动到指定位置，和使用 {{domxref("Element.scroll()")}} 设置 `behavior: "auto"` 效果一致。 -## 例子 +## 示例 -### Scrolling an element +### 滚动元素 -在这个例子中，尝试滚动带有虚线边框的内部容器，看看`scrollTop`的值是如何变化的。 +在这个示例中，尝试滚动带有虚线边框的内部容器，看看 `scrollTop` 的值是如何变化的。 #### HTML @@ -29,12 +31,7 @@ Safari 通过将`scrollTop`更新到最大滚动位置之外来响应过度滚

- Far out in the uncharted backwaters of the unfashionable end of the - western spiral arm of the Galaxy lies a small unregarded yellow sun. - Orbiting this at a distance of roughly ninety-two million miles is an - utterly insignificant little blue green planet whose ape-descended life - forms are so amazingly primitive that they still think digital watches are - a pretty neat idea. + 在银河系西旋臂少人问津的末端、未经勘测的荒僻区域深处，有一颗无人理睬的小小黄色恒星。以约莫九千两百万英里半径绕其旋转的，是一颗彻底无关紧要的小小蓝绿色行星，这上面从猿猴繁衍而来的生命形式原始得让人吃惊，居然还以为数字式电子表是什么很高明的主意。

@@ -70,7 +67,7 @@ scroller.addEventListener("scroll", (event) => { #### 结果 -{{EmbedLiveSample("Scrolling_an_element", 400, 250)}} +{{EmbedLiveSample("滚动元素", 400, 250)}} ## 规范 @@ -80,8 +77,8 @@ scroller.addEventListener("scroll", (event) => { {{Compat}} -## 参考 +## 参见 -- [MSDN's Measuring Element Dimension and Location]() +- [MSDN 测量元素尺寸和位置]() - {{domxref("Element.scrollLeft")}} - {{domxref("Element.scrollTo()")}}