473,320 Members | 2,088 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,320 software developers and data experts.

Tooltips position at prior-set location in Firefox

I've made tooltips work in Firefox*, but tooltip doesn't appear at the
specified location until the SECOND time that the user passes the mouse over
the location with the mouseover event. What I want is for the user to be
able to put the mouse over text that gives a year (e.g., "(1932)", "(1946)"
and "(1923)") and see the tooltip to the right and slightly beneath the
year.

(For the record -- this needn't concern the debugging effort -- I've also
put in code that overrides the mouse position when the mouse is already too
far to the right on the window or too near the bottom of the window to
display all of the tooltip. In these instances, adjustments are made to the
x-position and y-position of the layer. These parts of the function work
fine.)

What happens instead is the tooltip layer turns up where the mouse had been
on the PREVIOUS mouseover event. (On the first mouseover event after
loading/reloading, the tooltip turns up at the default (0,0) location.)
Thus, when the mouse does a mouseover at (131,50), for example, the layer
turn up at an unexpected location, sometimes even above or below where the
document is currently scrolled to show. However, on the second, third,
fourth, etc., consecutive mouseovers at this location, the tooltip will show
up where it is expected, in this case at or near (141,60).

The link is http://home.earthlink.net/~prodcode/...rTooltips.html. The
Javascript functions are in the file "functns.js" in the same directory.

The relevant code is:

var mereme=text;
document.getElementById("overDiv").firstChild.node Value=mereme;
document.getElementById("overDiv").style.fontface= "Times";
document.getElementById("overDiv").style.top=place Y+"px";
document.getElementById("overDiv").style.left=plac eX+"px";
document.getElementById("overDiv").style.width=ltr _width+"px";
document.getElementById("overDiv").style.visibilit y="visible";

placeX and placeY are set earlier, and in any event are set at the same
point in the set of procedures as they are set in IE, yet the current placeX
and placeY positions get used in IE and yet don't influence the next outcome
in Firefox.

Incidentally, the page works just fine in IE, so anyone reading this can
check out the same URL in IE to see the tooltips appear in the same place
every time that the mouse passes over any one particular spot. However,
Firefox uses an entirely different subroutine at this point than does IE, so
there's no point in studying the applicable parts of the code with an eye to
asking why it works different ways in IE and Firefox. (For that matter, IE5
uses a different sub-subroutine than does IE4 and IE6, but this needn't
concern us here. Everything works fine in IE4, IE5 and IE6, so far as I've
determined.)

Last side topic: I realize that as I currenly have the page programmed, in
Firefox (but not IE) the HTML designator for symbols displays as unconverted
HTML rather than as the desired symbol. (The visitor sees "’" spelled
out like that instead of the curled apostrophe.) I haven't yet looked into
all the ways I might fix this. (I understand from this newsgroup that
toReplace.innerHTML might be what I need.) Thus, I didn't post this message
to request help on this matter, although any unsolicited suggestion would be
a valuable this to see for readers of this newsgroup.)

--
David Hayes

(remove the name of the programming language from email address to make it
usable)

* For tooltips to work in Firefox requires a DIV, even if it's almost blank
(an empty DIV won't cut it, but having merely a space or a period in it and
setting it to invisibility, does work), and also that the <SCRIPT> tag
specify "type='text/javascript'" rather than "language='JavaScript'".
Jul 23 '05 #1
3 5137
David Hayes wrote:
I've made tooltips work in Firefox*, but tooltip doesn't appear at the
specified location until the SECOND time that the user passes the mouse over
the location with the mouseover event. What I want is for the user to be
able to put the mouse over text that gives a year (e.g., "(1932)", "(1946)"
and "(1923)") and see the tooltip to the right and slightly beneath the
year.
Have you validated your page? There is no doctype, which is
primarily responsible for the W3C's validator finding 70-odd errors
in the page.

Firefox's JavaScript console reports:

"parent.parent.frames[0] has no properties"

Can I suggest that you look at the 'find position' stuff at
quirksmode:

<URL:http://www.quirksmode.org/js/findpos.html>

It provides a full, cross-browser solution in a few lines of code.

Your year text can be in a span that has a mouseover/out, use this.id
(where id provides a key to your tip text array) to determine the tip
text to show.

That's it. Another suggestion is to put the tip div in the page as
HTML and use display: none to hide it by default, then use
mouseover/out to hide/show it at the appropriate location with
the appropriate text. You don't need to do any other styling with
script, it can all be done with CSS.

There are also some good tool tips at the link below, but they may be
a bit over the top for what you are doing (but there are some good
ideas to pick up):

<URL:http://www.walterzorn.com/tooltip/tooltip_e.htm>

[...] The relevant code is:

var mereme=text;
document.getElementById("overDiv").firstChild.node Value=mereme;
document.getElementById("overDiv").style.fontface= "Times";
document.getElementById("overDiv").style.top=place Y+"px";
document.getElementById("overDiv").style.left=plac eX+"px";
document.getElementById("overDiv").style.width=ltr _width+"px";
document.getElementById("overDiv").style.visibilit y="visible";


As a side issue (using the idea above makes this code redundant)
looking up the element every time is very inefficient - how about:

var oDiv = document.getElementById("overDiv");
oDiv.firstChild.nodeValue = mereme;
oDiv.style.fontFamily = "Times";
oDiv.style.top = placeY+"px";
oDiv.style.left = placeX+"px";
oDiv.style.width = ltr_width+"px";
oDiv.style.visibility = "visible";

Note that style property "fontface" should be "fontFamily".

[...]

--
Rob
Jul 23 '05 #2
"RobG" <rg***@iinet.net.auau> wrote in message
news:42***********************@per-qv1-newsreader-01.iinet.net.au...
David Hayes wrote:
I've made tooltips work in Firefox*, but tooltip doesn't appear at the
specified location until the SECOND time that the user passes the mouse over the location with the mouseover event. What I want is for the user to be able to put the mouse over text that gives a year (e.g., "(1932)", "(1946)" and "(1923)") and see the tooltip to the right and slightly beneath the
year.
Have you validated your page? There is no doctype, which is
primarily responsible for the W3C's validator finding 70-odd errors
in the page.

Firefox's JavaScript console reports:

"parent.parent.frames[0] has no properties"


The page I gave the URL for is an edited sample page, and even the full page
is only one of several that access the same ".js" file. Believe me, I often
call functions that use parent.parent.frames[0]. It's simply the case that
parent.parent.frames[0] is not called by the functions about which I wrote
in my newsgroup message. The functions that use parent.parent.frames[0]
work just fine, but that is irrelevant so far as the under-discussion issue
is concerned.
Can I suggest that you look at the 'find position' stuff at
quirksmode:

<URL:http://www.quirksmode.org/js/findpos.html>

It provides a full, cross-browser solution in a few lines of code.
I did consult quirksmode before I wrote the code under discussion. It's
helpful, and when I ran alerts to find out what values were being passed, I
was able to see how to use them. Something else is at work here.
Your year text can be in a span that has a mouseover/out, use this.id
(where id provides a key to your tip text array) to determine the tip
text to show.
Actually, not. I use the same long messages again and again, sometimes more
than once on a given page, certainly many times over the course of different

HTML pages. By just passing a variable and letting the variable be
converted to a five-line, multi-sentence message within the .js file, I save
a great deal of space over what would be expended were I to repeat this text
in every <SPAN> (or <DIV>) where the mouseover/mouseout would occur.
That's it. Another suggestion is to put the tip div in the page as
HTML and use display: none to hide it by default, then use
mouseover/out to hide/show it at the appropriate location with
the appropriate text.


Same problem. The same messages are used on different pages.

In any event, I am not having problems passing those variables that
determine what text is to display. (Slight cavaet: I haven't figured out
how to convert the HTML &#nnn; characters into curled apostrophes and the
like.) The problem I'm having is that the tooltips are being displayed at
the location where the previous tooltip should be displayed, and the next
tooltip will display where the current one should have displayed. Again,
because IE is displaying them where they should display, the problem in
Firefox is not in my choice of the sequence of actions within my functions,
but rather the problem is in how some variable is being handled under the
hood, perhaps even some speed issue. Anyone know of instances where perhaps
Firefox gets ahead of itself and uses an old instance of a variable because
it didn't finish calculating the new one? This sounds peculiar, I know.

(As before, the link to my test page is
http://home.earthlink.net/~prodcode/...rTooltips.html. The Javascript
functions are in the file "functns.js" in the same directory.)

--
David Hayes

(remove the name of the programming language from email address to make it
usable)

Jul 23 '05 #3
The previous message was a false alarm! The error turns out to have been
attributable to a function that ran both before and after another one, so I
was assuming it was finished when the variables were giving the correct
returns even as the other behavior came to happen. Those interested in the
resolution can still look at the code. (The error message in IE no longer
occurs; that was attributable to a function call made from the body onload.
The whole <BODY> tag was copied from another file that did almost the same
thing, and I ignored the fact that in the test version being posted, the
prerequisites for the function being called would not be met by the abridged
version of the file in that the version being shared here was cut to deal
with only those functions that needed to be examined. Thus, an error was
given which pointed to a problem that didn't need to be addressed and merely
misled anyone not looking at the pertinent functions.)

How many times do we see in these newsgroups reports that another set of
eyes were needed to find the obvious or that one's own eyes are perfectly
adequate for finding the problem once sufficient time has elapsed for one to
become detached from the moment that the problem seemed insurmountable?

--
David Hayes

(remove the name of the programming language from email address to make it
usable)
Jul 23 '05 #4

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

0
by: shraddha | last post by:
Hi I want to implement dynamic interactive tooltips in java so that the user can expand / collapse them. Also, if there are hyperlinks in the tooltip text, the user should be able to follow up...
2
by: Morten | last post by:
Hi. I'd like to be able to make tooltips for some "span" elements. So I'd do like: <dic class="toolblock">Stuff<span class="tooltip">Something about "Stuff"</span></div> and then use the below...
14
by: Mario | last post by:
I wrote a tooltips script. I've noticed "small" problem occuring while using the IE browser. If a site is long enough for a scroll to appear and we move the mouse indicator on the link then the...
3
by: Wayne | last post by:
Is anybody aware of other software conflicting with Access and disabling the tool tips. I've had this problem in the past and now have it again after rebuilding my desktop and notebook. Both fail...
1
by: Wayne Aprato | last post by:
Tooltips in Access have not worked on my machine for a long time despite several reinstalls of the operating system and applications at fairly regular intervals. I have finally pinned down the...
1
by: Jim | last post by:
I've posted this a couple of times, no luck so far. Any info would be greatly appreciated. The tooltips are very useful, but this oddity is very annoying, particularly because I'm visually...
21
by: PlainDave | last post by:
Hi, Is there a way to make windows tooltips stay up longer than the default 5 seconds using CSS in a web page? I'd prefer to have it stay visible as long as the mouse is over the "whatever." The...
1
by: Robert Smith | last post by:
Hello, I have a Tree that contains tooltips, however when I right click on a node of the tree the context menu covers up the tooltips and it looks rather unprofessional. I wish to hide the...
1
by: TyBreaker | last post by:
I have a simple form with a toolstrip on it and some toolstrip buttons. Tooltips work fine. But then I use the ShAppBarMessage API call to register the form as an Application Desktop Toolbar. ...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
1
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.