Blazor Tooltip - Overview
- EXAMPLE
- VIEW SOURCE
- EDIT IN TELERIK REPL
- Change Theme
default
- Overview.razor
The Tooltip component is part of Telerik UI for Blazor, a professional grade UI library with 110+ native components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.
Description
The Telerik UI for Blazor Tooltip is a familiar UI tool that displays information related to any UI element on the page. You can choose whether it opens when the associated element is hovered over, clicked or tapped on.
Browsers have default built-in tooltips, but the Telerik UI for Blazor Tooltip is more robust in its functionality. It replaces the browser-based tooltip to show the title or alt attribute of its target in a modern popup that looks consistent across browsers. Here are a few of the features you get by using this component:
- Specify a CSS selector to attach the same tooltip to multiple targets.
- Configure the tooltip size.
- Customize its content according to the current target through a template.
- Use templates to load content on demand.
- Choose a position relative to the target and the event on which it shows.
If you browse the demo above, you will see that a tooltip showing a location’s population will appear upon hovering over that location’s marker. In this case, a single tooltip is used for every instance, and its content is loaded from a <span> title attribute. If you use the “Change Theme” menu to pick different themes and palettes, you can observe how the tooltip changes. You can also use the “Edit in Telerik REPL” link to open this demo in the REPL playground and tweak the code yourself.