Page 1 of 1

how to use tooltip in select element

Posted: Thu Mar 06, 2003 8:41 am
by zia
Hello everybody,

Would you please give me some tips aboput tooltip? I would like to use it with <option> of <select> element. The text will come from oracle database. And I like to happen this when user will move cursor over the options of <select> element. I am working with PHP, Apache and Oracle.

Thank you in advance.

ZIA

Posted: Thu Mar 06, 2003 9:59 am
by patrikG
You just need HTML:

Code: Select all

<a href="whatever.html" title="This is a link to whatever.html">whatever</a>
the key is "title" - works like the "alt" for images.

Posted: Fri Mar 07, 2003 7:23 am
by zia
patrikG

Thank you. But that is not the solution I am seeking for. I want to show tooltip when users will scroll over their mouse on the options of a pulldown menu(<select> element).

Do you know how can I accomplish this?

ZIA

Posted: Fri Mar 07, 2003 7:32 am
by twigletmac
You can use the title attribute in the option tags:

Code: Select all

<option value="something" title="something else">text</option>
but whether or not a browser will show that info to the user as a 'tooltip' will depend on the browser.

Mac

Posted: Fri Mar 07, 2003 7:38 am
by twigletmac
Just done a couple of tests and as far as I can see:
IE 5 - no (doesn't show tooltip)
Mozilla - yes (shows tooltip)
Netscape 6 - yes
Opera 6 - no
Netscape 4 - no

Not an exhaustive test but support seems fairly patchy. Maybe you want to think a little more about what you are trying to accomplish?

Mac

Posted: Fri Mar 07, 2003 11:36 pm
by zia
twigletmac

I have tested with IE 6 and it doesn't show. Is their any other way to accomplish it through IE?

Thank you.

ZIA

Posted: Mon Mar 10, 2003 2:06 am
by twigletmac
Having done a search on Google for tooltip select option it looks like an IE solution involves a lot of JavaScript and CSS hacking. Maybe there's another way you could get the information you need to to your users?

Mac

Posted: Mon Mar 10, 2003 2:16 am
by patrikG
<select> under IE 4+ supports the "onmouseover"-event. So basically, you can create an associative array with tooltips for each individual <select>-option. Get the mouse-co-ordinates when the mouseover is triggered, write the tooltip from your associative array into the layer, move the layer to the x,y-co-ordinates, then make it visible.

That way you would have something wich would work in IE - but I have no clue whether <select> supports "onmouseover" in other browsers.