useHover

sensors

test coverage

Last changed: 17 days ago

Hook that defines the logic when hovering an element

import { useHover } from '@siberiacancode/reactuse';

Usage

const hovering = useHover(ref, () => console.log('callback'));
// or
const hovering = useHover(ref, options);
// or
const [ref, hovering] = useHover(() => console.log('callback'));
// or
const [ref, hovering] = useHover(options);

Demo

source

Api

Parameters

Name	Type	Default	Note
target	HookTarget	-	The target element to be hovered
callback?	(event: Event) => void	-	The callback function to be invoked on mouse enter

Returns

boolean

Parameters

Name	Type	Default	Note
target	HookTarget	-	The target element to be hovered
options.onEntry?	(event: Event) => void	-	The callback function to be invoked on mouse enter
options.onLeave?	(event: Event) => void	-	The callback function to be invoked on mouse leave

Returns

boolean

Parameters

Name	Type	Default	Note
callback?	(event: Event) => void	-	The callback function to be invoked on mouse enter

Returns

{ ref: StateRef<Target> } & UseHoverReturn

Parameters

Name	Type	Default	Note
options.onEntry?	(event: Event) => void	-	The callback function to be invoked on mouse enter
options.onLeave?	(event: Event) => void	-	The callback function to be invoked on mouse leave

Returns

{ ref: StateRef<Target> } & UseHoverReturn

Source

Source • Demo

Contributors

debabin

str0yka

hywax