Javascript Mousemove事件：相对于父元素的鼠标位置

我有一个div，我想听听

mousemove

事件，看看鼠标和div顶部之间的偏移量（因此我使用event.layerY）。在这个部门里，我还有一个部门

问题是当我将鼠标移到这个内部div上时，我的

mousemove

事件将侦听内部div，而不是我设置侦听器的外部div。意思是

event.layerY

将给出内部div的偏移量，而不是外部div的偏移量

这是我的代码：

this.draglistener = this.renderer.listen(this.container.nativeElement, 'mousemove', e => {
        e.stopPropagation();
    });

如您所见，我累了

stopPropagation（）

，但这不起作用。 我也试过：

if (e.target !== this.container.nativeElement) {
            return;
}

但是这样，当移动到内部div时，它就停止了对事件的监听。所以这也不起作用

我也不能做

指针事件：无用于内部div，因为我需要侦听此div上的其他一些事件

有什么想法吗？
要获得鼠标相对于外部
div
的位置，请从鼠标的客户端位置减去外部
div
的客户端位置。模板引用变量
outerDiv
可用于将外部元素传递给事件处理程序

<div #outerDiv (mousemove)="onMouseMove($event, outerDiv)">
  <div class="innerDiv">
  </div>
</div>

请参阅以获取演示。
您是否尝试了
e.preventDefault（）
和
e.stopPropagation（）它似乎与标准事件绑定一起工作，而不停止传播。请参阅。@ConnorsFan谢谢您的代码。我发现为什么它对我不起作用。我将内部div设置为
位置：绝对
（CSS）。当您更改它时，您的代码将像我的代码一样运行。但我需要相对的位置。你知道怎么解决这个问题吗？@AbhinavKumar不工作了。我遇到了一个无法控制加载时滚动位置的情况，所以我不得不查看
窗口。滚动
，然后从顶部减去它
让top=e.pageY-overlay\u offset.top-scrollY\u offset
onMouseMove(event: MouseEvent, outerDiv: HTMLElement) {
  const bounds = outerDiv.getBoundingClientRect();
  const posX = event.clientX - bounds.left;
  const posY = event.clientY - bounds.top;
  console.log(posX, posY);
}