Hi,
Is it possible to change the style of tooltips for individual items in the web drop down? All of our controls use a javascript function to display their tooltips because the standard tooltips do not display long enough. These tooltips are styled by a tooltips.css file and I would like the tooltips for the items in the dropdown to be the same. Below is an example of how we handle the tooltips for a standard text box.
And this is how I currently setup the WebDropDown.
<
ig:WebDropDown ID="ddTreatmentRoute" runat="server" DropDownAnimationType="Linear" DropDownContainerHeight="0px" DropDownContainerMaxHeight="0px" DropDownContainerWidth="0px"EnableDropDownAsChild="True" MultipleSelectionType="Checkbox" PageSize="0" StyleSetName="Office2007Blue" EnableRenderingAnchors="False" DisplayMode="DropDownList" ToolTip="Initial Tooltip for overall control.">
<Items>
<ig:DropDownItem Selected="False" Text="Please select" Value="0">
</ig:DropDownItem>
<ig:DropDownItem Selected="False" Text="Auricular use" Value="1" ToolTip="Item 1 tooltip">
<ig:DropDownItem Selected="False" Text="Cutaneous use" Value="2" ToolTip="Item 2 tooltip.">
<ig:DropDownItem Selected="False" Text="In-feed use" Value="3" ToolTip="Item 3 tooltip.">
</Items>
<Button AltText="" />
</ig:WebDropDown>
Thanks
Luke
Hello Luke,there are ItemMouseOver and ItemMouseOut client-side events, which you can use for adding a custom javascript function for displaying a tooltip. <script type="text/javascript"> function ItemMouseOver (sender, eventArgs) { var item = eventArgs.get_value(); // gets a reference of a DropDownItem var value = item.get_value(); // gets the item's value //your custom tooltip code } function ItemMouseOut (sender, eventArgs) { //your custom tooltip code }</script> <ig:WebDropDown ID="ddTreatmentRoute" runat="server" DropDownAnimationType="Linear" Width="200px" DropDownContainerHeight="0px" DropDownContainerMaxHeight="0px" DropDownContainerWidth="0px" EnableDropDownAsChild="True" MultipleSelectionType="Checkbox" PageSize="0" EnableRenderingAnchors="False" DisplayMode="DropDownList" ToolTip="Initial Tooltip for overall control."> <ClientEvents ItemMouseOver="ItemMouseOver" ItemMouseOut="ItemMouseOut" /> <Items> <ig:DropDownItem Selected="False" Text="Please select" Value="0"> </ig:DropDownItem> <ig:DropDownItem Selected="False" Text="Auricular use" Value="1" ToolTip="Item 1 tooltip"> </ig:DropDownItem> <ig:DropDownItem Selected="False" Text="Cutaneous use" Value="2" ToolTip="Item 2 tooltip."> </ig:DropDownItem> <ig:DropDownItem Selected="False" Text="In-feed use" Value="3" ToolTip="Item 3 tooltip."> </ig:DropDownItem> </Items> </ig:WebDropDown>Regards,Nikolai Dimitrov