i tried out adding titles using javascript. But i'm not getting the tool tip.
can u help me to bring the tool tip for each and every options in the select control.
my HTML Code:
<select id="DropDownList1" onmouseover='showHideTooltip();' size='5'style="LEFT: 104px;POSITION: absolute; TOP: 160px;Width:180px;z-index:9999;">
<option Value="One" Selected="True">One</option>
<option Value="Two">Two</option>
<option Value="Three">Threee</option>
<option Value="Four">Four</option>
<option Value="Five">Five</option>
</select>
my javascript Code:
function addTitleAttributes()
{
numOptions = document.getElementById('DropDownList1').options.length;
for (i = 0; i < numOptions; i++)
document.getElementById('DropDownList1').options[i].title = document.getElementById('DropDownList1').options[i].text;
alert('completed');
}
-
Originally Posted by
mowen85
Thanks for your reply, but I'd just already worked out a solution.
When an OPTION in a SELECT has a TITLE attribute, the value of TITLE is automatically shown as a tooltip when you hover over that option. My problem was that I'm using JSF and in that, the way that a drop down menu is dynamically generated doesn't allow for title tags to be added so I thought I'd have to make some tooltips manually.
I've been mucking around in Javascript though and have created a function to call after the page has loaded (and the drop down box has been generated) that will set the TITLE attribute for each OPTION to be whatever the text of that option is. This allows me to have my truncated options but still view the full text by hovering over them.
function addTitleAttributes()
{
numOptions = document.getElementById('comboBox').options.length;
for (i = 0; i < numOptions; i++)
document.getElementById('comboBox').options[i].title =
document.getElementById('comboBox').options[i].text;
}
I only need this to work in IE so I haven't tested it in any other browser.
Last edited by peter_budo : Mar 27th, 2008 at 2:35 am. Reason: Keep It Organized - please use [code] tags