如何检测 cursor 悬停一个元素而不移动它？
[英]How to detect that the cursor hovers an element without moving it?
问题描述
我正在构建一个 web 应用程序，其中页面具有上一个/下一个导航按钮。 它是一个单页 React 应用程序，当导航按钮悬停时，上一页或下一页的数据会被预取。
当用户在不移动鼠标的情况下单击“下一步”两次时，尽管鼠标一直悬停在按钮上（在每个页面上都位于同一 position 上），但不会预加载第三页的数据，因为不会触发mouseover事件直到和除非鼠标在每次页面加载后至少移动 1px。
有没有一种方法可以在不移动 cursor 的情况下检测鼠标悬停事件，这不涉及手动检查按钮的尺寸，特别是通过getBoundingClientRects()并与页面加载时的 cursor clientX / clientY坐标进行比较？
提前致谢！
1 个解决方案
解决方案1
0 已采纳 2019-10-30 23:25:38
正如 jalynn2 和 Shilly 所建议的那样，最好将此属性存储在onMouseLeave中作为 boolean 在onMouseEnter上为true ，反之亦然
如何让cursor适应新加载的页面内容而不移动
[英]How to make cursor adapt to the content of the new loaded page without moving it
当鼠标悬停在下载按钮上时如何停止页脚与下载按钮一起移动
[英]How to to stop footer moving together with download button when mouse hovers on it
jQuery + CSS：如何检测光标从元素中的第一个“移出”？
[英]jQuery + CSS: How to detect the first “move out” of cursor out of an element?
光标通过CSS：hover更改。 无需移动鼠标即可从DOM中删除元素。 更新鼠标光标？
[英]Cursor is changed via CSS :hover. Element is removed from the DOM without mouse moving. Update mouse cursor?
创建一个移动栏（在导航栏内），该栏会移动到用户悬停的元素上？
[英]Creating a moving bar (inside the nav bar) which moves to the element the user hovers on?
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.