React Tooltip

Overview

The KendoReact Tooltip provides a popup with information that is related to a particular UI element. The React Tooltip can be displayed when hovering over or clicking on an element.

See React Tooltip Overview demo

React Tooltip - Overview, KendoReact UI Library

Anchor Elements

To ensure that any HTML element can show additional information, the KendoReact Tooltip allows the component to be displayed and anchored to any HTML element on a page.

See React Tooltip Anchor Elements demo

React Tooltip - Anchor Elements, KendoReact UI Library

Positioning

By default, the KendoReact Tooltip determines its position automatically by understanding the available space around the component when it displays on a page. To take control over where and how the React Tooltip displays, one can simply use the position property.

See React Tooltip Positioning demo

React Tooltip - Positioning, KendoReact UI Library

Multiple Tooltips

The KendoReact Tooltip is not limited to being displayed in one area of the same page. In fact, the KendoReact Tooltip can be used multiple times throughout a single React component, ensuring that any element that needs additional information can utilize a Tooltip.

See React Tooltip Multiple s demo

React Tooltip - Multiple Tooltips, KendoReact UI Library

Custom Rendering

Out of the box, the KendoReact Tooltip has built-in styling that fits with the current theme that has been applied to the KendoReact UI components. For further customization with the look and feel, the KendoReact Tooltip has the ability for templates to be used to customize the content, look and feel of the Tooltip.

See React Tooltip Custom Rendering demo

React Tooltip - Custom Rendering, KendoReact UI Library

Controlled and Uncontrolled Modes

The KendoReact Tooltip supports both controlled mode, where the React Tooltip maintains its own state, and uncontrolled mode, where the state is maintained outside of the KendoReact Tooltip.

See React Tooltip Controlled and Uncontrolled Modes demo

Integration with KendoReact Components

Since it is a very flexible component, the KendoReact Tooltip can easily be integrated in to other KendoReact UI components, including components like the KendoReact Grid or KendoReact Charts.

React Tooltip - Integration with KendoReact Components, KendoReact UI Library

Next Steps

Visit Our Demos

See KendoReact in action and check out how much it can do out-of-the-box.

See Pricing

Buy an individual license for KendoReact, or treat yourself to Kendo UI, our complete JavaScript bundle.

Start Free Trial

Try KendoReact with dedicated technical support.