Events
Events available in ReactTooltip component.
danger
This has been deprecated. Use the openOnClick
tooltip prop instead.
Using hover
info
This is the default event option, so it doesn't have to be manually set.
import { Tooltip } from 'react-tooltip';
import 'react-tooltip/dist/react-tooltip.css';
<a data-tooltip-id="my-tooltip"> ◕‿‿◕ </a>
<Tooltip
id="my-tooltip"
content="Hello world!"
events={['hover']}
/>
Using click
info
Clicking anywhere outside the anchor element will close the tooltip.
import { Tooltip } from 'react-tooltip';
import 'react-tooltip/dist/react-tooltip.css';
<a data-tooltip-id="my-tooltip"> ◕‿‿◕ </a>
<Tooltip
id="my-tooltip-click"
content="Hello world!"
events={['click']}
/>