如何设置自定义光标在特定区域外自动消失的详细方法？

本文共计716个文字，预计阅读时间需要3分钟。

原文解释为何自定义光标图象在 `mouseleave` 事件后不消失，并提供修复方案：

在实现基于 DOM 元素的自定义光标时，一个常见却容易被忽视的问题是：光标图像（如 <img>）虽被动态定位到鼠标位置，但一旦它被添加到目标容器内（如 .box），其本身会成为可交互的 DOM 节点——即使视觉上只是“跟随”鼠标。当鼠标移出 .box 区域时，若自定义光标图像恰好覆盖在边界附近，浏览器会先触发该 <img> 上的 mouseleave（从 .box 到 <img>），而非直接离开 .box 容器，导致 box.addEventListener('mouseleave') 无法可靠执行，光标因此“卡住”不隐藏。

根本原因在于：默认情况下，<img> 元素会捕获鼠标事件，中断了父容器对鼠标离开行为的准确感知。