Touch:screenX 属性

Limited availability

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

返回触摸点相对于屏幕的 X 坐标,不包括任何滚动偏移。

数字。

示例

此示例演示了如何访问 Touch 对象的 Touch.screenXTouch.screenY 属性。Touch.screenX 属性是触摸点相对于屏幕的水平(x)坐标,以 CSS 像素为单位。Touch.screenY 属性是触摸点相对于屏幕的垂直坐标,以 CSS 像素为单位。

在以下简单代码片段中,我们假设用户在 id 为 source 的元素上发起多个触摸点接触,然后释放与表面的接触。当触发 touchstart 事件处理器时,可以访问每个触摸点的 Touch.screenXTouch.screenY 坐标。

js
// 为“source”元素注册一个 touchstart 监听器。
const src = document.getElementById("source");

src.addEventListener(
  "touchstart",
  (e) => {
    // 遍历每个触点并记录 screenX/Y 坐标。
    // 每个坐标的单位是 CSS 像素。
    for (let i = 0; i < e.touches.length; i++) {
      console.log(`touchpoint[${i}].screenX = ${e.touches[i].screenX}`);
      console.log(`touchpoint[${i}].screenY = ${e.touches[i].screenY}`);
    }
  },
  false,
);

规范

Specification
Touch Events
# dom-touch-screenx

浏览器兼容性

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
screenX

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.