469,916 Members | 2,562 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,916 developers. It's quick & easy.

Script problem with Netscape 7

Hello all !

I need help with this script :
It's a tooltip appearing onMouseOver on a link. It works fine in IE, Opera
but not Netscape 7 and Mozilla 1.5.
The tooltip sticks on the top left corner of the window.

Any help appreciated :-)

Thanks

==================================
<script language="JavaScript" type="text/JavaScript">
<!--
function initToolTips(){
offsetX = 0;
offsetY = 15;
ns4 = document.layers;
ns6 = document.getElementById && !document.all;
ie4 = document.all;
toolTipSTYLE="";
if (ns4 || ns6 || ie4) {
if (ns4) toolTipSTYLE = document.toolTipLayer;
else if(ns6) toolTipSTYLE =
document.getElementById("toolTipLayer").style;
else if(ie4) toolTipSTYLE = document.all.toolTipLayer.style;
if (ns4) document.captureEvents(Event.MOUSEMOVE);
else {
toolTipSTYLE.visibility = "visible";
toolTipSTYLE.display = "none";
}
document.onmousemove = moveToMouseLoc;
}
}
//--------------------------
function moveToMouseLoc(e) {

if(ns4 || ns6) {
x = e.pageX; y = e.pageY;
} else {
x = event.x + document.body.scrollLeft;
y = event.y + document.body.scrollTop;
}
toolTipSTYLE.left = x + offsetX;
toolTipSTYLE.top = y + offsetY;
return true;
}
//--------------------------
function toolTip(valItal, valGras, msg, fg, bg, police, tailleTexte) {

if(toolTip.arguments.length < 1) { // hide

if (ns4) toolTipSTYLE.visibility = "hidden";
else toolTipSTYLE.display = "none";
} else { // show
var content =
'<table border="0" cellspacing="0" cellpadding="1" bgcolor="' + fg +
'"><td>' +
'<table border="0" cellspacing="0" cellpadding="1" bgcolor="' + bg +
'"><td align="center"><font face="'+ police +'" color="' + fg +
'" size="' + tailleTexte + '">&nbsp\;' + msg +
'&nbsp\;</font></td></table></td></table>';

if (ns4) {
toolTipSTYLE.document.write(content);
toolTipSTYLE.document.close();
toolTipSTYLE.visibility = "visible";
}
if (ns6) {
document.getElementById("toolTipLayer").innerHTML = content;
toolTipSTYLE.display='block'
}
if (ie4) {
document.all("toolTipLayer").innerHTML=content;
toolTipSTYLE.display='block'
}
}
}
//-->
</script>
</head>

<body>
<div id="toolTipLayer" style="position:absolute; visibility: hidden"></div>

<script language="JavaScript">
<!--
initToolTips();
-->
</script>

<p>
<a href="javascript:;"
onMouseOver="toolTip('0','0','TEXT','#000000','#FF FFFF','Arial, Helvetica,
sans-serif','2')" onMouseOut="toolTip()">Test 1</a>
</p>

Jul 20 '05 #1
2 2965
"Phil" <pa*******@pasdemail.com> writes:
Hello all !

I need help with this script :
It's a tooltip appearing onMouseOver on a link. It works fine in IE, Opera
but not Netscape 7 and Mozilla 1.5.
The tooltip sticks on the top left corner of the window.

Any help appreciated :-) <script language="JavaScript" type="text/JavaScript">
The language attribut can be omitted
<!--
and so can this.


function initToolTips(){
offsetX = 0;
offsetY = 15;
ns4 = document.layers;
ns6 = document.getElementById && !document.all;
ie4 = document.all;
These five variables are global, and are used as such. I would
declare them outside the function to signal this.

Your variables suggests that only ie4 has a document.all property.
That is not true. Generally, browser detection is not a very stable
way of making the script compatible with other browsers.

Where does the values of the variables "offsetX" and "offsetY" come
from?
toolTipSTYLE="";
Since this variable is used to hold an object, I would initialize it
with null instead of the empty string.

All in all, I would use the following code instead:
---
var offsetX = 0;
var offsetY = 15;
var toolTipStyle;

function initToolTip() {
var toolTipElem;
if (document.getElementById) {
toolTipElem = document.getElementById("toolTipLayer");
} else if (document.all) {
toolTipElem = document.all["toolTipLayer"];
} else if (document.layers) {
toolTipElem = document.layers["toolTipLayer"];
}
if (!toolTipElem) {return;} // something wrong.
toolTipStyle = toolTipElem.style || toolTipElem;

toolTipStyle.visibility = "visible";
toolTipStyle.display = "none";

// listen to mouse move event
if (document.addEventListener) {
document.addEventListener("mousemove",moveToMouseL oc,false);
} else if (document.attachEvent) {
document.attachEvent("onmousemove",function(){
moveToMouseLoc(window.event);
});
} else {
document.onmousemove = moveToMouseLoc;
}
if (document.captureEvents && window.Event &&
window.Event.MOUSEMOVE) {
document.captureEvents(window.Event.MOUSEMOVE);
}
}
---
function moveToMouseLoc(e) {

if(ns4 || ns6) {
Here you assume something about the event from your guess at the
browser. If the guess is wrong, so is the result. That should not
be a problem for NS7/Mozilla, though.
x = e.pageX; y = e.pageY;
Make variables local if possible.
} else {
x = event.x + document.body.scrollLeft;
y = event.y + document.body.scrollTop;
If the browser is in standards mode (which all new pages *should* put
it), the scroll{Top,Left} values are placed on document.documentElement,
not document.body.
}
toolTipSTYLE.left = x + offsetX;
Probable cause of problem: You assign a CSS length without a unit. You
*must* add a unit, probably pixels ("px").
toolTipSTYLE.top = y + offsetY;
return true;
}
My suggested function
---
function moveToMouseLoc(event) {
var x,y;
if (typeof event.pageX == "number") {
x = event.pageX;
y = event.pageY;
} else {
var root = document.documentElement||document.body;
var x = event.clientX + root.scrollLeft;
var y = event.clientY + root.scrollTop;
}
toolTipStyle.left = (x+offsetX)+"px";
toolTipStyle.top = (y+offsetY)+"px";
}
---

<script language="JavaScript">
The *type* attribute is required in HTML 4.
Does your page validate?
<a href="javascript:;"


Avoid javascript:-URL's.
<URL:http://jibbering.com/faq/#FAQ4_24>

/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'
Jul 20 '05 #2
> Does your page validate?

Don't think so :-)
In fact the whole code is a snippet coming from Dreamweaver...
I made some arrangements with global variables, because I can't have them
'global' for a future use

I will review all that.
Thanks a lot for your help and suggestions.
Jul 20 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

11 posts views Thread by Jonny | last post: by
4 posts views Thread by Wm | last post: by
7 posts views Thread by Russ | last post: by
9 posts views Thread by Tuy Solang | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.