Touch:pageY 属性

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Touch.pageY 只读属性返回触摸点相对于视口的 Y 坐标,包括任何滚动偏移。

double 类型的浮点值,表示触摸点相对于视口的 Y 坐标,包括任何滚动偏移。

示例

此示例说明如何访问 Touch 对象的 Touch.pageXTouch.pageY 属性。Touch.pageX 属性是相对于视口的触摸点的水平坐标(以 CSS 像素为单位),包括任何滚动偏移。Touch.pageY 属性是相对于视口的触摸点的垂直坐标(以 CSS 像素为单位),包括任何滚动偏移。

在以下简单代码片段中,我们假设用户在 source 元素上启动一个或多个触摸点,移动这些触摸点,然后释放与表面的所有接触点。当触发 touchmove 事件处理器时,可以通过事件的 TouchEvent.changedTouches 列表访问每个触摸点的 Touch.pageXTouch.pageY 坐标。

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,
);

规范

Specification
Touch Events
# dom-touch-pagey

浏览器兼容性

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
pageY

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
Partial support
Partial support
No support
No support
Has more compatibility info.