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'".