use-mouse-move
v1.0.1
Published
React hook for listening to mouse move events
Downloads
6
Readme
useMouseMove
Listen to mouse move events with a React hook.
Install
npm install use-mouse-move
oryarn add use-mouse-move
Use
import useMouseMove from 'use-mouse-move';
function App() {
const [x, y] = useMouseMove();
return (
<p>
Your mouse coordinates are {x}, {y}.
</p>
);
}
Variants
The useMouseMove
hook accepts one parameter -- a MouseMoveVariant
enum that
you can import from the use-mouse-move
package. These variants coincide with
the different x/y coordinates emit by mouse move events.
import useMouseMove, { MouseMoveVariant } from 'use-mouse-move';
useMouseMove(MouseMoveVariant.Default);
MouseMoveVariant.Default
:x
andy
(default if no variant is specified)MouseMoveVariant.Client
:clientX
andclientY
MouseMoveVariant.Movement
:movementX
andmovementY
(relative movement)MouseMoveVariant.Offset
:offsetX
andoffsetY
MouseMoveVariant.Page
:pageX
andpageY
MouseMoveVariant.Screen
:screenX
andscreenY
Sponsor 💗
If you are a fan of this project, you may become a sponsor via GitHub's Sponsors Program.