-
Notifications
You must be signed in to change notification settings - Fork 8.1k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[zh-cn]: update the translation of Touch
pageY
property (#22973)
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
- Loading branch information
1 parent
eda1b67
commit 91bd01a
Showing
1 changed file
with
32 additions
and
17 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,31 +1,46 @@ | ||
--- | ||
title: Touch.pageY | ||
title: Touch:pageY 属性 | ||
slug: Web/API/Touch/pageY | ||
l10n: | ||
sourceCommit: b71d118ffc6d72b77efad9661110fcc9ede464eb | ||
--- | ||
|
||
{{ ApiRef() }} | ||
{{ APIRef("Touch Events") }} | ||
|
||
### 概述 | ||
**`Touch.pageY`** 只读属性返回触摸点相对于视口的 Y 坐标,包括任何滚动偏移。 | ||
|
||
触点相对于 HTML 文档上边沿的 Y 坐标。和 `clientY` 属性不同,这个值是相对于整个 html 文档的坐标,和用户滚动位置无关。因此当存在垂直滚动的偏移时,这个值包含了垂直滚动的偏移。 | ||
## 值 | ||
|
||
### 语法 | ||
`double` 类型的浮点值,表示触摸点相对于视口的 Y 坐标,包括任何滚动偏移。 | ||
|
||
```plain | ||
var y = touchItem.pageY; | ||
``` | ||
## 示例 | ||
|
||
此示例说明如何访问 {{domxref("Touch")}} 对象的 {{domxref("Touch.pageX")}} 和 `Touch.pageY` 属性。{{domxref("Touch.pageX")}} 属性是相对于视口的触摸点的水平坐标(以 CSS 像素为单位),包括任何滚动偏移。`Touch.pageY` 属性是相对于视口的触摸点的垂直坐标(以 CSS 像素为单位),包括任何滚动偏移。 | ||
|
||
### 返回值 | ||
在以下简单代码片段中,我们假设用户在 `source` 元素上启动一个或多个触摸点,移动这些触摸点,然后释放与表面的所有接触点。当触发 {{domxref("Element/touchmove_event", "touchmove")}} 事件处理器时,可以通过事件的 {{domxref("TouchEvent.changedTouches")}} 列表访问每个触摸点的 {{domxref("Touch.pageX")}} 和 `Touch.pageY` 坐标。 | ||
|
||
- `y` | ||
- : 触点相对于 HTML 文档上边沿的 Y 坐标。当存在垂直滚动的偏移时,这个值包含了垂直滚动的偏移。 | ||
```js | ||
// 为“source”元素注册一个 touchmove 监听器。 | ||
const src = document.getElementById("source"); | ||
|
||
src.addEventListener( | ||
"touchmove", | ||
(e) => { | ||
// 遍历已移动的触摸点并记录每个触摸点。 | ||
// 每个坐标的单位是 CSS 像素,包括 pageX/Y 坐标。 | ||
for (let i = 0; i < e.changedTouches.length; i++) { | ||
console.log(`touchpoint[${i}].pageX = ${e.changedTouches[i].pageX}`); | ||
console.log(`touchpoint[${i}].pageY = ${e.changedTouches[i].pageY}`); | ||
} | ||
}, | ||
false, | ||
); | ||
``` | ||
|
||
### 标准定义 | ||
## 规范 | ||
|
||
[Touch Events Specification](http://www.w3.org/TR/touch-events/) | ||
{{Specifications}} | ||
|
||
### 相关链接 | ||
## 浏览器兼容性 | ||
|
||
- {{ domxref("Touch.pageX") }} | ||
- {{ domxref("Touch.screenY") }} | ||
- {{ domxref("Touch.clientY") }} | ||
{{Compat}} |