Touch: clientY 属性
Touch.clientY 只读属性返回触摸点相对于浏览器视口的 Y 坐标，不包括任何滚动偏移。
值
一个浮点值（double），表示触摸点相对于视口的 Y 坐标，不包括任何滚动偏移。
示例
此示例演示如何使用 Touch 对象的 Touch.clientX 和 Touch.clientY 属性。Touch.clientX 属性是触摸点相对于浏览器视口的水平坐标，不包括任何滚动偏移。Touch.clientY 属性是触摸点相对于浏览器视口的垂直坐标，不包括任何滚动偏移。
在此示例中，我们假设用户在 ID 为 source 的元素上开始触摸，在元素内或元素外移动，然后释放接触表面。当 touchend 事件处理程序被调用时，会计算从起始触摸点到结束触摸点 Touch.clientX 和 Touch.clientY 坐标的变化。
js
// Register touchstart and touchend listeners for element 'source'
const src = document.getElementById("source");
let clientX;
let clientY;
src.addEventListener("touchstart", (e) => {
// Cache the client X/Y coordinates
clientX = e.touches[0].clientX;
clientY = e.touches[0].clientY;
});
src.addEventListener("touchend", (e) => {
let deltaX;
let deltaY;
// Compute the change in X and Y coordinates.
// The first touch point in the changedTouches
// list is the touch point that was just removed from the surface.
deltaX = e.changedTouches[0].clientX - clientX;
deltaY = e.changedTouches[0].clientY - clientY;
// Process the data…
});
规范
| 规范 |
|---|
| 触摸事件 # dom-touch-clienty |
浏览器兼容性
加载中…