When the Tooltip TargetSelector is button[title] and you change the Calendar's view mode, the Tooltip text remains the initial one. Steps to reproduce:

https://blazorrepl.telerik.com/cIvORFuC16Zgi9yP55

1. Hover over the view navigation button. The Tooltip text is Choose a month, which is correct.
2. Change the view.

Now the navigation button text is 2024 and the Tooltip should display Choose an year, but instead, it displays Choose a month. If you change the view again the button text is 2020-2029 and the Tooltip text remains Choose a month, when it should display Choose a decade.

===ADMIN EDIT===

In the meantime, the workaround is to keep using one Tooltip for the whole application and have another one that targets only the navigation button in the Calendar. Here is an example: https://blazorrepl.telerik.com/GobanlEC46JfsnNk08 

Hi !

After upgrading to the lastest version (6.1.0) we have an issue with the tootip.

The small arrow that points towards the elements that have the title attribute is not showing where it should (the arrow stays centered).

Here is an example:

If the element of the tooltip is on top of the screen (almost outside of the viewport), hovering the remaining part of the element makes the tooltip create a flashing effect.

Please watch the attached video. 

When a position is specified the tooltip is rendered initially aside from the target element before displaying at the correct position

Team,

Currently I am using Telerik UI Blazor with 3.7.0 version, few cases and intermittently TooltipShowEvent.Click is not working and tooltip is not getting displayed and unable to find root cause for it.

Could you please assist what is causing for this behaviour and feasible solution?

Below is sample code snippet where we use 3 tabs

<TelerikTabStrip Class="tmGraphTabStrip" ActiveTabIndex="@ActiveTab" ActiveTabIndexChanged="@ActiveTabChanged" @ref="@TabRef">
@for (var i = 0; i < 4; i++)
 {
<TabStripTab Title="@TabName" Class="tmTabHeaderCellStyle">
<TelerikGridLayout RowSpacing="20px" ColumnSpacing="1px" Class="grid-CardlayoutNew">
@*
display data in gridlayout structure for each row/column along with tooltip, we are able to see div selector and target selector Ids from Dev Tools browser
*@
</TelerikGridLayout>
</TabStripTab>
}
</TelerikTabStrip>

Ex:

<TelerikTooltip TargetSelector="@ToolTipCurselector" ShowOn="@TooltipShowEvent.Click" Position="TooltipPosition.Top">
</TelerikTooltip>

Please consider the ToolTip's ability to track changes in its target and update its own position accordingly.

A good example for this is the integration between the ToolTip and the Slider drag handle.

I'm using the ToolTip component to display tooltips for anything that has a "title":

<TelerikTooltip TargetSelector="[title]"></TelerikTooltip>

I've got a popup window with a close button that displays the tooltip "Close".

Upon clicking the button and the window closing, the tooltip remains until I click something or another tooltip appears.

Since 2.27 I have a weird behaviour when I try to open a tooltip that should be shown on click. This is a sample:

<span id="tooltip-here">
    <span style="background-color: gray">Text 1</span>
    gap
    <span style="background-color: gray">Text 2</span>
</span>
<TelerikTooltip TargetSelector="#tooltip-here" ShowOn="TooltipShowEvent.Click" />

In 2.26 the tooltip was shown when I clicked in any element inside the outer span. Check file 226.gif.

Now, in 2.27 it is being shown just when I click on the "gap". Check file 227.gif.


Thanks!

Tooltip does not show if moving from one element with Tooltip to another and both elements are placed directly next to each other.

Example: If a number of Buttons (with title) are placed right next to each other if mouse is moved over the first one the tooltip is displayed correctly. If the mouse is moved to the next one the first tooltip closes but the second one does not show. Moving on to the third button the tooltip is displayed correctly again.

Is there a way to add some delay to the TelerikTooltip component show event? I would like to force the user to hover in the element for a couple of seconds before he can see the tooltip.

Like in the ajax tooltip demo.

Using a target selector for HTML elements with a specific attribute within an SVG does not work

The following snippet worked correctly in 2.26.0 and older versions but does not work in 2.27.0

<TelerikArcGauge>
    <ArcGaugeCenterLabel>
        <Template>
            @(context.Pointers[0].Value)
        </Template>
    </ArcGaugeCenterLabel>
    <ArcGaugeScales>
        <ArcGaugeScale Min="0" Max="100">
        </ArcGaugeScale>
    </ArcGaugeScales>
    <ArcGaugePointers>
        <ArcGaugePointer Color="#FFE162" Value="@FirstPointerValue"></ArcGaugePointer>
    </ArcGaugePointers>
</TelerikArcGauge>

<TelerikTooltip TargetSelector="path[stroke='#FFE162']" Position="TooltipPosition.Top" ShowOn="@TooltipShowEvent.Hover" Id="first-pointer">
    <Template>
        <p>Value is: @FirstPointerValue</p>
    </Template>
</TelerikTooltip>

@code {
    public int FirstPointerValue { get; set; } = 20;
}

Best Regards,

Radko

I have a div which has a couple of buttons contained within it on the lower left corner. I have a TelerikTooltip with the target selector pointed to my div. Most of the time the tooltip works fine but I have found that if I move the mouse onto the div from the lower left corner where the buttons are, the TelerikTooltip shows up correctly while the mouse is over the buttons but when I move the mouse farther into the div and away from the buttons the TelerikTooltip gets hidden and a default tooltip is displayed.

It behaves this way whether I use a title on the div or a template on the TelerikTooltip.

As shown in the Tooltip - Show Event demo, the title does appear on hover as well as on click. 

I was under the impression that this is not supposed to happen.

See the attached video for how to reproduce this.

A ToolTip will trigger a JavaScript error in the following scenarios:

• There is no TargetSelector.
• The TargetSelector does not match any elements on the page.

The JS error is thrown on mouse click:

TypeError: undefined is not an object (evaluating 't.getAttribute')

Hover the mouse several times in a row at element c on the demo stand. OS Windows 10, Browsers: Chrome Version 87.0.4280.141 (Official Build) (64-bit) + Firefox Developer 85.0b9 (64-bit).

Tell me why the component periodically has 2 tooltips? This anomaly is also observed on your demo stand.