Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations derfloh on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Tooltips for Dropdown Lists (New Twist)

Status
Not open for further replies.

glennrose

Programmer
Aug 9, 2006
2
US
This has been discussed in the forums, but I have a couple new twists at the end. I will start with exactly what I am trying to do, and then give details. In short, I need to add a ToolTip to a DropDown List on my web page.

Now, after looking through dozens of sites, I know that:
a) DropDown Lists themselves do not have tooltips; "Title" will not work.
b) Using an A Element will not work as well.

So, I have started dabbling with JavaScript and creating my own ToolTip
(I've hidden some details):

<select id="MyList" onmouseover='javascript: ShowToolTip("X")'
onmouseout='javascript: HideToolTip()>
<option value="0">Off</option>
<option value="1">Low</option>
<option value="2">Med.</option>
<option value="3">High</option>
</select>
<div id="DHTMLToolTip"></div>

function ShowToolTip(ToolTipText) {
var MyToolTip=document.all["DHTMLToolTip"];

MyToolTip.innerHTML=ToolTipText;

var curX=event.clientX;
var curY=event.clientY;
var offsetX=-60;
var offsetY=20;

MyToolTip.style.left=(curX+offsetX) + "px";
MyToolTip.style.top=(curY+offsetY) + "px";

MyToolTip.style.visibility="visible";

return true;
}

function HideToolTip() {
var MyToolTip=document.all["DHTMLToolTip"];

MyToolTip.style.visibility="hidden"

return true;
}

There are two major problems:
1) The page containing this code is in a short frame (acting like a toolbar). As a result, the custom tooltip usually appears below the bottom border, making it unseen. In comparison, regular tooltips appear above everything, including the frame below.
2) The dropdown list always seems to appear above the custom tooltip.

Thus, this solution does not seem to be the way to go.

Does anyone know the solution to this?

Also, while I am talking about tooltips, where can I find the default settings for tooltips?
 
there are a myriad of examples on the web. simply take one of the already-developed custom select boxes and add a "title" attribute to the appropriate items.



*cLFlaVA
----------------------------
[tt]"quote goes here"[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top