jaikumar1
7 years agoMentor
How to add tooltip?
Hi,
We are just looking into add tooltip in some of the page labels. For that i have added script in the component and, which get attached respective HTML tags into the specific label. The below code added into the labels,
<span class="HelpIcon"> <a class="lia-link-navigation help-icon lia-tooltip-trigger" id="link_18" href="#"><img class="lia-img-icon-help lia-fa-icon lia-fa-help" alt="Some text" aria-label="Help Icon" id="display_0" src="/skins/images/0920E85D2B8661AC2570D4C45EA5CD7E/base/images/icon_help.png"></a> </span>
After the code added the icon not working as expected, and i identified the render jquery tooltip not getting added into the page
LITHIUM.RenderedScripts = [ "jquery.tools.tooltip-1.2.5.js", "Tooltip.js", "Entry.js", "jquery.tools.tooltip-1.2.5.js", "Tooltip.js", "Entry.js", "jquery.tools.tooltip-1.2.5.js", "Tooltip.js", ];
and this script
LITHIUM.Tooltip({"bodySelector":"body#lia-body","delay":30,"triggerSelector":"#link_16","tooltipContentSelector":"#link_17-tooltip-element .content","position":["bottom","left"],"tooltipElementSelector":"#link_17-tooltip-element","events":{"def":"focus mouseover,blur mouseout"}});
So could you please guide me, how can we apply these additional code into the page?