Last Updated: 13 Apr 2019 08:35 by ADMIN
Created on: 20 Aug 2015 14:36
Category: ToolTip
Type: Bug Report
Fix RadTooltip does not behave like default browser tooltips when nested
The RadTooltip and RadTooltipManager do not display tooltips like the default browser tooltips, if the tooltips are "nested".

Consider HTML like this

My name is <span class="app" title="Person Tooltip">Mathyß<a class="noteLink criticalRight" id="RqoTeiLink_a" title="Der Notelink Tooltip"><sup>a</sup></a> Schwertzenbachen</span>, and I live somewhere. 

If you tooltipify this HTML then only the "outer" tooltip is displayed all the time. When using just the browser, then it displays correctly the "inner" tooltip when you hover over the link.

As the behaviour is not consitent with the browser (and other Tooltip libraries) this should be fixed.
1 comment
Marin Bratanov
Posted on: 13 Apr 2019 08:33
Hi Jörg,

The behavior is different, because RadToolTip is a DOM structure that relies on JS handling of events. The mouse events bubble up the DOM and in this case, the span's mouse events will always fire after the anchor's events. This is what triggers the RadToolTip for the span to always show, and that, in turn, hides that previous tooltip for the anchor. I am also attaching here a screenshot that illustrates this as a reference.

The browser tooltips do not rely on the DOM events, so they can have different behavior.

For RadToolTip, however, such behavior is a heuristic task that it cannot solve - in order to achieve such nesting, it must stop the event from bubbling in some cases, but not in others. Moreover, preventing the event propagation can break other logic on the page, like hover effects, that also relies on the mouse events.

Marin Bratanov
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Attached Files: