New to Telerik UI for ASP.NET AJAXStart a free 30-day trial

First Steps with RadToolTip

The following tutorial demonstrates how RadToolTip is used to provide a custom tooltip for a single element.

  1. In a new AJAX-Enabled Web Application, add a HyperLink control from the Standard tab to the default web page.

  2. Set the Text property to "Telerik Web Site" and the NavigateUrl to "https://www.telerik.com".

  3. Drop a RadToolTip control from the ToolBox to the default web page.

  4. Set the RadToolTip TargetControlID property to the ID property of the HyperLink.

  5. Set the Position property to be BottomCenter.

  6. Set the Title property to "Telerik Site Link".

  7. Set the Text property to "Click here to navigate to the Telerik Web Site".

  8. Set the Skin property to Telerik.

  9. Press F5 to run the application. Run the mouse over the HyperLink to view the tooltip.

Example 1 - Creating RadTooltip in the aspx page

ASPX
<telerik:RadScriptManager ID="RadScriptManager1" runat="server" />
<asp:HyperLink ID="HyperLink1" runat="server" Text="Telerik Web Site" NavigateUrl="https://www.telerik.com"></asp:HyperLink>
<telerik:RadToolTip ID="RadToolTip1" runat="server" TargetControlID="HyperLink1" Position="BottomCenter"
    Skin="Telerik" Title="Telerik Site Link" Width="200px" Height="60px">
    <contenttemplate>
        Click here to navigate to the Telerik Web Site
    </contenttemplate>
</telerik:RadToolTip>

Example 2 - Dynamic creation

C#
    protected void Page_Load(object sender, EventArgs e)
    {
        Button button = new Button();
        button.ID = "Button1";
        button.Text = "Click me";
        button.ToolTip = "This is a tooltip";

        RadToolTip tooltip = new RadToolTip();
        tooltip.TargetControlID = "Button1";
        tooltip.Text = "This is a tooltip";
        tooltip.BackColor = Color.Yellow;
        tooltip.ForeColor = Color.Red;

        this.Form.Controls.Add(button);
        this.Form.Controls.Add(tooltip);
    }

See Also

In this article
See Also
Not finding the help you need?
Contact Support