Link to home
Start Free TrialLog in
Avatar of teena2
teena2

asked on

to create tooltip

i wish that whenever i select a value in a list box the complete text of that option should be available as tooltip as due to size i am  not able to show the complete text

<!-- Begin
function showtip2(current,e,text){
  if (document.all&&document.readyState=="complete"){
    document.all.tooltip2.innerHTML=text
    document.all.tooltip2.style.pixelLeft=event.clientX+document.body.scrollLeft+10
    document.all.tooltip2.style.pixelTop=event.clientY+document.body.scrollTop+10
    document.all.tooltip2.style.visibility="visible"
}
  else if (document.layers){
    document.tooltip2.document.nstip.document.write('<b>'+text+'</b>')
    document.tooltip2.document.nstip.document.close()
    document.tooltip2.document.nstip.left=0
    currentscroll=setInterval("scrolltip()",100)
    document.tooltip2.left=e.pageX+10
    document.tooltip2.top=e.pageY+10
    document.tooltip2.visibility="show"
}
}
function hidetip2(){
  if (document.all)
    document.all.tooltip2.style.visibility="hidden"
    else if (document.layers){
    clearInterval(currentscroll)
    document.tooltip2.visibility="hidden"
}
}
function test(this)
{
 
  t1.onMouseover="showtip2(this,event,'Be sure to check out our other JavaScripts!');"
  t1.onMouseout="hidetip2();"
  t1.STYLE="cursor: hand"
}
//  End -->
</script>

</HEAD>

<BODY>
<div id="tooltip2" style="position:absolute;visibility:hidden;clip:rect(0 250 50 0);width:350px;background-color:gold;z-index:10"></div>

<input type=button name="t" value="t" onMouseover="showtip2(this,event,'hello');" onMouseout="hidetip2();" STYLE="cursor: hand">
<select name="t1" id="t1" size=2 onclick="test(this);">
<option >teena</option>
<option>ritish</option>
</select>
this text shows tooltip but that is partly hidden behind the list box
if not possible then plz tell me how to add horizontal scrollbar in list box
plz reply soon
ASKER CERTIFIED SOLUTION
Avatar of Michel Plungjan
Michel Plungjan
Flag of Denmark image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Which sort of suggests that doing a

function test(t1) {
document.getElementById('t').title=t1.options[t1.selectedIndex].text;
}


<input type=button id="t"
name="t" value="t">
<select name="t1" id="t1" size=2 onclick="test(this);">

is a smarter solution
Avatar of fargo
fargo

Hii,

take a look at the following link...it'S one of the best..and easy to use.

http://www.bosrup.com/web/overlib/

This may be of some help.
regards
fargo
He does however have the same problem if one reads the FAQ


"Why do form elements show up on top of the popups? They sort of bleed.

This is a browser issue that we can't do much about :(. The only work around would be to place the form elements themselves in layers and hide while showing the popups"
No comment has been added lately, so it's time to clean up this TA.
I will leave the following recommendation for this question in the Cleanup topic area:

Accept: mplungjan {http:#8477933}

Please leave any comments here within the next seven days.
PLEASE DO NOT ACCEPT THIS COMMENT AS AN ANSWER!

jAy
EE Cleanup Volunteer