Javascript mousemove工作不正常

我是jquery mousemove事件的新手，下面是我的代码

<div id="a1" style="width:100%;height:100%;top:0px;left:0px; position:absolute">
  <div id="tracker1">
  </div>
</div>


$(a1).mousemove(function(event) {
   var x = event.pageX;
   var y = event.pageY;
   var absolutePositionx = x - $('#a1').offset().left;
   var absolutePositiony = y - $('#a1').offset().top;

   $("#tracker1").css({
     left: absolutePositionx,
     top: absolutePositiony
   });
});

$（a1）.mousemove（函数（事件）{
var x=event.pageX；
var y=event.pageY；
var absolutePositionx=x-$（'#a1'）.offset（）.左；
var absolutePositiony=y-$（'#a1'）.offset（）.top；
$（“#tracker1”）.css({
左：绝对位置X，
顶部：绝对位置
});
});

问题是当我在边界上缓慢移动鼠标时，跟踪器（红点）有可能会移出元素，这很奇怪，不应该发生。当光标超出指定元素时，为什么mousemove事件仍然激发？

---

感谢您的帮助

将属性

溢出：hidden

添加到

.a1

.b1

和

.c1

为我修复了它

之所以会发生这种情况，是因为点或跟踪器嵌套在您跟踪鼠标移动的位置内，因此当您缓慢移动时，此鼠标仅在点上移动，从而触发鼠标移动事件。您可以这样修复它：

<!-- change this -->
<div class="a1" id="a1" style="width:100%;height:100%;top:0px;left:0px; position:absolute">
    <div id="tracker1">
    </div>
</div>

<!-- to this -->
<div class="a1" id="a1" style="width:100%;height:100%;top:0px;left:0px; position:absolute">
</div>

<div id="tracker1">
</div>

<!-- for all 3 instances -->

---

非常感谢您的代码@Jonasw已经在那里了，不熟悉StackOverflow谢谢，我知道了！感谢您的回复！：）因为一旦跟踪器移出父框，它将被隐藏。