ethanselzer / react-cursor-position

A React component that decorates its children with mouse and touch coordinates relative to itself.
https://ethanselzer.github.io/react-cursor-position
MIT License
143 stars 35 forks source link

isPositionOutside:true due to negative x or y values, when mouse is in container #30

Open weiner opened 5 years ago

weiner commented 5 years ago

When react-cursor-position is wrapped in react-slick and in modal container like react-responsive-modal it happens that the position of x or y can get negative even when the mouse is in the container.

To reproduce I created this Codesandbox POC https://codesandbox.io/s/wwwvzv1818

Steps to reproduce:

  1. Visit https://codesandbox.io/s/wwwvzv1818 e.g in Chrome 71
  2. Open the overly
  3. slide the carousel to the left e.g 3 time
  4. move the mouse

Current Result: x or y values go to negative, and isPositionOutside is set to true even when the mouse is in the container.

Emidomenge commented 5 years ago

+1 I have same problem. Help plz

todmar13 commented 5 years ago

How specifically to slide it to the left 3 times, it's already open on the left and does not cycle.

k-andrey commented 5 years ago

Possible solution: call method reset() on ReactCursorPosition each time you slide the carousel. I have similar problem with ReactCursorPosition inside scrollable container - it helps me.