Hello,
I'm trying to make different tooltips appear as the mouse moves over the various options of a select. I found a slick method for doing so in mozilla-based browsers, but IE chokes on it.
Any help for making this work in IE would be very much appreciated.
Here's the code I found: - <HEAD>
-
<STYLE>
-
#tooltip {
-
position: absolute;
-
visibility: hidden;
-
border: 1px solid black;
-
background-color: lightyellow;
-
}
-
</STYLE>
-
<SCRIPT>
-
var descriptions = {
-
'1': 'This is number 1.',
-
'2': 'This is number 2.',
-
'3': 'This is number 3.'
-
}
-
function showTooltip (nextTo, tip) {
-
var tt = document.getElementById('tooltip');
-
tt.innerHTML = descriptions[tip];
-
tt.style.left = (getPageLeft(nextTo) + nextTo.offsetWidth) + 'px';
-
tt.style.top = getPageTop(nextTo) + 'px';
-
tt.style.visibility = 'visible';
-
}
-
function hideTooltip () {
-
document.getElementById('tooltip').style.visibility = 'hidden';
-
}
-
function getPageLeft (el) {
-
var left = 0;
-
do
-
left += el.offsetLeft;
-
while ((el = el.offsetParent));
-
return left;
-
}
-
function getPageTop (el) {
-
var top = 0;
-
do
-
top += el.offsetTop;
-
while ((el = el.offsetParent));
-
return top;
-
}
-
</SCRIPT>
-
</HEAD>
-
<BODY>
-
<DIV ID="tooltip"></DIV>
-
<SELECT ID="aSelect"
-
ONMOUSEOVER="showTooltip(this, event.target.value)"
-
ONMOUSEOUT="hideTooltip();"
-
>
-
<OPTION VALUE="1">1
-
<OPTION VALUE="2">2
-
<OPTION VALUE="3">3
-
</SELECT>
-
-
</BODY>
-
Thanks in advance,
jj
11  18924 
Thank you, but unfortunately my knowledge level is not high enough that I could get this from the page you reference.
The part of the script that IE is choking on is the event argument in the onmouseover on the select itself, shown here:
<SELECT ID="aSelect"
ONMOUSEOVER="showTooltip(this, event.target.value)"
ONMOUSEOUT="hideTooltip();"
>
Apparently IE doesn't know what to do with that. Any suggestions on how I might work around that?
Thank you, again,
jj
Read from this part. For IE, you need to use event.fromElement instead of relatedTarget (which is W3C).
Hi,
event.fromElement doesn't work either for this case
any advice?
Hi,
event.fromElement doesn't work either for this case
any advice?
Post your code.
it is almost the same code as above, only i changed/add : - function showTooltip (nextTo, e) {
-
tip=(!e.target?event.srcElement.value:e.target.value)
and - ONMOUSEOVER="showTooltip(this,event)"
that removes the errors from IE, but still leaves the variable tip (under IE) undefined - <HEAD>
-
<STYLE>
-
#tooltip {
-
position: absolute;
-
visibility: hidden;
-
border: 1px solid black;
-
background-color: lightyellow;
-
}
-
</STYLE>
-
<SCRIPT>
-
var descriptions = {
-
'1': 'This is number 1.',
-
'2': 'This is number 2.',
-
'3': 'This is number 3.'
-
}
-
function showTooltip (nextTo, e) {
-
tip=(!e.target?event.srcElement.value:e.target.value)
-
var tt = document.getElementById('tooltip');
-
tt.innerHTML = descriptions[tip];
-
tt.style.left = (getPageLeft(nextTo) + nextTo.offsetWidth) + 'px';
-
tt.style.top = getPageTop(nextTo) + 'px';
-
tt.style.visibility = 'visible';
-
}
-
function hideTooltip () {
-
document.getElementById('tooltip').style.visibilit y = 'hidden';
-
}
-
function getPageLeft (el) {
-
var left = 0;
-
do
-
left += el.offsetLeft;
-
while ((el = el.offsetParent));
-
return left;
-
}
-
function getPageTop (el) {
-
var top = 0;
-
do
-
top += el.offsetTop;
-
while ((el = el.offsetParent));
-
return top;
-
}
-
</SCRIPT>
-
</HEAD>
-
<BODY>
-
<DIV ID="tooltip"></DIV>
-
<SELECT ID="aSelect"
-
ONMOUSEOVER="showTooltip(this, event)"
-
ONMOUSEOUT="hideTooltip();"
-
>
-
<OPTION VALUE="1">1
-
<OPTION VALUE="2">2
-
<OPTION VALUE="3">3
-
</SELECT>
-
-
</BODY>
that works... only not for <SELECT MULTIPLE> ... and that is the bit i want to get workin'
You mean it hides underneath the select?
no, it doesn't fill the tip variable on IE
so i get a tooltip with the text 'undefined'
See this thread.
It seems that for a multiple select, IE gives the select object. I'm not sure what its value would be. That link might help you.
Thank you for your reply, i did see this post, and under IE it gives the wrong value, the name of the selectbox that is... not the value of the <option> element
and the select alert doesn't work at all
Sign in to post your reply or Sign up for a free account.
Similar topics
by: * ProteanThread * |
last post by:
but depends upon the clique:
...
|
by: rollasoc |
last post by:
Hi,
Doing a bit of system testing on a Windows 98 laptop. (.Net 1.1 app).
Did a bit of testing. Loaded a previously saved file. A gray box
appeared with the text and buttons all white...
|
by: Jeff Rodriguez |
last post by:
Here's what I want do:
Have a main daemon which starts up several threads in a Boss-Queue structure.
From those threads, I want them all to sit and watch a queue. Once an entry
goes into the...
|
by: Scott M. |
last post by:
How can I disable the cross-site scripting check for one particular page of
a site?
|
by: Pieter |
last post by:
Hi,
I'm having some weird problem using the BackGroundWorker in an Outlook
(2003) Add-In, with VB.NET 2005:
I'm using the BackGroundWorker to get the info of some mailitems, and after
each item...
|
by: jlamanna |
last post by:
I was wondering if there was a utility that could tell you when your C#
application is making cross-apartment COM calls. I have a fairly large
application that makes extensive use of a 3rd party...
|
by: Rob Woodworth |
last post by:
Hi,
I'm having serious problems getting my report to work. I need to
generate a timesheet report which will contain info for one employee between
certain dates (one week's worth of dates). I...
|
by: Robert Bravery |
last post by:
Hi all,
Can some one show me how to achieve a cross product of arrays. So that if I
had two arrays (could be any number) with three elements in each (once again
could be any number) I would get:...
|
by: Charles |
last post by:
I'd like to develop a simple cross-platform application in C++. I'd
like it to run in Windows, OS X, PC-BSD and Linux. From my research, it
seems I should use Qt or Gtk as a graphical library. Do...
|
by: ampo |
last post by:
Hello.
Can anyone help with cross-domain problem?
I have HTML page from server1 that send xmlHTTPRequest to server2.
How can I do it?
Thanks.
|
by: emmanuelkatto |
last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud.
Please let me know.
Thanks!
Emmanuel
|
by: BarryA |
last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
|
by: Sonnysonu |
last post by:
This is the data of csv file
1 2 3
1 2 3
1 2 3
1 2 3
2 3
2 3
3
the lengths should be different i have to store the data by column-wise with in the specific length.
suppose the i have to...
|
by: Hystou |
last post by:
There are some requirements for setting up RAID:
1. The motherboard and BIOS support RAID configuration.
2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
|
by: marktang |
last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
|
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers,...
|
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
|
by: Hystou |
last post by:
Overview:
Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
|
by: isladogs |
last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM).
In this session, we are pleased to welcome a new...
| |
