javascript - 如何计算鼠标相对于转换后的父级的偏移量

Question

如何计算鼠标光标的 offsetX 和 offsetY，相对于正在转换的元素，即使鼠标没有移动？

https://jsfiddle.net/kevin_dorion/usrLd1x3/34/

// this is the value I need to update, even when the mouse is not moving
offsetEl.innerHTML = `x: ${evt.offsetX} y: ${evt.offsetY}`;

如您所见，在 mousemove 上，我得到了 offsetX 和 offsetY 值，这正是我所需要的。但我还需要注意当鼠标不移动时这些值会发生变化。

requestAnimationFrame(animate);
// how do I manually calculate offsetX and offsetY of the mouse cursor relative to the "el" element when the mouse is not moving?

我正在考虑保留最后一个鼠标事件，使用 pageX/pageY 定位一个元素，然后计算它的偏移量，但我无法让它正常工作。

谢谢！

编辑：我正在考虑存储最后一个已知的矩阵/鼠标坐标组合，使用当前矩阵并进行一些插值，但我也无法正确...

标签： javascriptmatrixmouseeventlinear-algebracss-transforms