css layer not working in Firefox or Netscape

[jsreblev]

Hi Javascript gurus:

I have tried several things, using several Javascript books, but can't get
this to work in Netscape (latest version) and Firefox (latest v.). It works
in MIE and Opera fine. A box (defined by a css layer) is supposed to pop
out to the right when the corresponding box on the far left is moused over.
The first function defines a layer id to the next function which pops out
the box. After debugging in Venkman, it looks like the first function
cannot define the layer id properly to the second function, which actually
slides the box (layer) to the right.

I thought that the getElementById function was supposed to work for Firefox,
but I must be using it wrong(???)

To see how it's supposed to work, view the following page in MIE or Opera:
http://www.tfn.net/~chorale/join_us.html

function makeName(layerID) {

if (document.all)
{ refname = eval("document.all." + layerID + ".style") }
else if (document.layers)
{ refname = eval("document.layers(layerID)"); }
else
{ refname = document.getElementById("layerID"); }
// { refname = layerID }
// { refname = eval("document." + layerID) }
// { refname = eval("document." + layerID) }
// { refname = layerID; }
return refname;
}

function slide () {
if ((parseInt(layername.left) < xgoal) ||
(parseInt(layername.top) < ygoal))
{ layername.left = parseInt(layername.left) + xhop;
layername.top = parseInt(layername.top) + yhop;
// window.setTimeout("slide()", delay)
}
else if ((parseInt(layername.left) == xgoal) ||
(parseInt(layername.top) == ygoal))
{ layername.left = parseInt(layername.left) - xhop;
layername.top = parseInt(layername.top) - yhop;
// window.setTimeout("slide()", delay)
}
}

This is a portion of the HTML code that calls the box (in this case, the
"sponsors" css class), and assigns it a layer name, which is then passed to
the slide function, which moves the box to the right based on the x & y
coordinates. The box is defined by a css <div class=> statement as
'sponsors'.:

layername=makeName('sponsors'); yhop=0; ygoal=150; xhop=165; xgoal=165;
slide()";

Thanks for any help you can give.
--
Rebecca Levings
Lively Health Products
850-443-4641
(e-mail address removed)
http://www.lively.myarbonne.com
https://www.juiceplus.com/athlete/+rl21248

 

[David Dorward]

if (document.all)

Needed exclusively for Internet Explorer 4. Other versions of Internet
Explorer support it. Some other browsers support it, but, AFAIK they all
return false if you test for it (on the principle that if you are smart
enough to test for it, your smart enough to use the standard DOM).

else if (document.layers)

Needed for, and supported only by, Netscape 4.x.

{ layername.left = parseInt(layername.left) + xhop;

http://www.mozilla.org/docs/web-developer/upgrade_2.html#dom

Not going near the style property of the element, and failing to set units
(which are required for non-zero lengths).

 

[RobG]

jsreblev wrote:
[...]

function makeName(layerID) {

if (document.all)
{ refname = eval("document.all." + layerID + ".style") }

What Daivd said, plus the use of eval here is totally redundant:

refname = document.all.layerID.style;

There is also no need to make refname global (it's not needed at all).
Test getElementById first, it will suit 99% of browsers:

if (document.getElementById) {
return document.getElementById(layerID).style;
} else if (document.all)
return document.all[layerID].style;
} else if (document.layers){
return document.layers(layerID);
}
return null;


Untested, based on your code.

[...]

 

[Lee]

RobG said:

jsreblev wrote:
[...]

function makeName(layerID) {

if (document.all)
{ refname = eval("document.all." + layerID + ".style") }

What Daivd said, plus the use of eval here is totally redundant:

refname = document.all.layerID.style;

There is also no need to make refname global (it's not needed at all).
Test getElementById first, it will suit 99% of browsers:

if (document.getElementById) {
return document.getElementById(layerID).style;
} else if (document.all)
return document.all[layerID].style;
} else if (document.layers){
return document.layers(layerID);

return document.layers[layerID];

Square brackets would be required in this rare case.

}
return null;


Untested, based on your code.

[...]