useHover()
useHover<
T
>(element
):boolean
Defined in: src/hooks/dom/useHover.ts:31
A custom React hook to track whether a referenced element is being hovered.
Type Parameters
• T extends HTMLElement
= HTMLElement
Parameters
element
RefObject
<T
>
A React ref object pointing to the target element.
Returns
boolean
isHovered
- Whether the element is currently being hovered.
Example
tsx
import { useRef } from 'react';
import { useHover } from '@zl-asica/react';
const MyComponent = () => {
const ref = useRef<HTMLDivElement>(null);
const isHovered = useHover(ref);
return (
<div ref={ref} style={{ backgroundColor: isHovered ? 'blue' : 'gray' }}>
Hover me!
</div>
);
};