如何允许鼠标单击靠近元素？答案

【问题标题】：How to allow a mouse click close to an element?如何允许鼠标单击靠近元素？
【发布时间】：2019-06-13 18:42:32
【问题描述】：

很久以前，在一次关于 React 的会议演讲中，我看到演示者在他的代码中添加了一些内容，允许您通过点击并拖动屏幕上的分隔线，使其达到一定数量的像素，而不是完全点击它。

这是一个提高可用性的方便概念，虽然我不知道它叫什么。也许添加“slop”？无论如何，我完全忘记了他是如何做到的，大概是使用了一些填充方法。有谁知道这种做法叫什么以及如何实施？我认为这是他用 CSS 实现的，但不确定。

【问题讨论】：

【解决方案1】：

你可以使用 vanilla js 来做到这一点。使用element.getBoundingClientRect() 检索元素相对于主体的偏移量，并与实际的mouseX 和mouseY（当然是在点击时刻）进行比较，您现在知道元素与点击之间的距离，现在添加一些逻辑，例如：案例距离

【讨论】：