jaredLunde / jaredLunde/react-hook

[useMouse()] mouse.y is off by 0.5 and shows as -0.5 when at the very top of the tracked element

Open
#232 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
1.5k
Forks
96
PR merge metrics
No merged PRs in 30d

Description

**Describe the bug**
Regardless of position, position increments as 1 and starts at 0.5, so 1.5, 2.5, 3.5 etc. Will track to -0.5 before pos value is set to none (when mouse is slightly just above the element).

**To Reproduce**
Steps to reproduce the behavior:
1. Setup a div as specified in the instructions. Add `

x: {mouse.x} y: {mouse.y}

` to display pos within element.
2. Start from the top
3. Move mouse down the tracked div.
4. Reverse steps.

**Expected behavior**
y is not offset by 0.5 and that the numbers either freeze (preferably freeze) or not displayed when pos is exactly 0.

**Screenshots**
![error](https://ibb.co/993wh2D)

**Desktop (please complete the following information):**
- OS: Windows 10
- Browser: Brave
- Version: 1.42.97

**Additional context**
Done with Next.JS and on a styled-component element. Not sure that this would be a cause though.

Contributor guide

Open the contributing guide

Research direction

Start at the useMouse() hook and reproduce the reported behavior with a tracked div, moving the pointer from the top downward and back up. Inspect how the y position is calculated and verify that the result has no 0.5 offset and does not become -0.5 at the element boundary.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.