Netscape DHTML not working

[Catherine Lynn Smith]

OK, I know this issue has been beat to death, but I have tested my
script in Netscape 7.1 and it does seem to be getting the calculated
values it needs to create placement coordinates, and every example I
can find that 'works' in my netscape browser "appears" to use the same
style references to the various div objects that I am trying to use.
Yet even though I have verified the script is stepping through the
doResize subroutine, and the values are valid, nothing on my page gets
moved.

It works just great in IE6 but even with some cross browser
incompatibility, I would still expect that at least 'something' would
be modified in the netscape version but nuttin! What am I missing?
(and yes, I have compared my DOCTYPE definitions to those of
'functional' pages too)

// here's a sample of my js code to resize various div elements on my
page

// retreive an object including cross-browser support
function getObj(name) {
if (document.getElementById) {
if(document.getElementById(name)) {
this.obj = document.getElementById(name);
}
} else if (document.all) {
if(document.getElementById(name)) {
this.obj = document.all[name];
}
} else if (document.layers) {
if(document.layers[name]) {
this.obj = document.layers[name];
alert(name+" width:"+document.layers[name].width);
}
}
return this.obj;
}
// handle dynamic resizing of the various layers making up the page
framework
function doResize() {
// allBodyObj = new getObj('allBody');
olArcTopObj = new getObj('olArcTopDiv');
olArcTilObj = new getObj('olArcTilDiv');
olArcBotObj = new getObj('olArcBotDiv');

orArcObj = new getObj('orArcDiv');
orArcTopObj = new getObj('orArcTopDiv');
orArcTilObj = new getObj('orArcTilDiv');
orArcBotObj = new getObj('orArcBotDiv');


tlBlueObj = new getObj('tlBlueDiv');
ilArcTopObj = new getObj('ilArcTopDiv');
ilArcTilObj = new getObj('ilArcTilDiv');
ilArcBotObj = new getObj('ilArcBotDiv');
blBlueObj = new getObj('blBlueDiv');

trBlueObj = new getObj('trBlueDiv');
irArcObj = new getObj('irArcDiv');
irArcTopObj = new getObj('irArcTopDiv');
irArcTilObj = new getObj('irArcTilDiv');
irArcBotObj = new getObj('irArcBotDiv');
brBlueObj = new getObj('brBlueDiv');

orightNavObj = new getObj('orightNav');

centContObj = new getObj('centCont');

var xwid = document.body.clientWidth;
var yhig = document.body.clientHeight;

// pad x and y values for testing by border sizes
var padX = ilArcTilObj.offsetWidth + irArcTilObj.offsetWidth;
var padY = tlBlueObj.offsetHeight + blBlueObj.offsetHeight;

if(xwid < (cM.curX + padX)) { xwid = cM.curX + padX; }
if(yhig < (cM.curY + padY)) { yhig = cM.curY + padY; }

//if(is_nav) {
//} else {
// adjust outer arc X & Y axis
olArcTilObj.style.height = yhig - (olArcBotObj.offsetHeight +
olArcTopObj.offsetHeight); // stretch or contract outer left arc
elastic middle on y-axis
olArcBotObj.style.top = yhig - (olArcBotObj.offsetHeight +
tlBlueObj.offsetHeight); // move outer left arc bottom up or down
orArcTilObj.style.height = yhig - (orArcBotObj.offsetHeight +
orArcTopObj.offsetHeight + brBlueObj.offsetHeight); // stretch or
contract outer right arc elastic middle on y-axis
orArcBotObj.style.top = yhig - (orArcBotObj.offsetHeight +
brBlueObj.offsetHeight); // move outer right arc bottom up or down
orArcObj.style.left = xwid - orArcObj.offsetWidth; // move entire
outer right arc left or right

// adjust X-axis values
blBlueObj.style.width = xwid - brBlueObj.offsetWidth; // stretch or
contract bottom left blue box on x-axis
trBlueObj.style.width = xwid - tlBlueObj.offsetWidth; // stretch or
contract top right blue box on x-axis
centContObj.style.width = xwid - padX; // adjust width of center
content frame
irArcObj.style.left = xwid - irArcObj.offsetWidth; // move inner
right arc left or right
brBlueObj.style.left = xwid - brBlueObj.offsetWidth; // move bottom
right blue gradient left or right

// adjust Y-axis values
ilArcTilObj.style.height = yhig - (ilArcBotObj.offsetHeight +
ilArcTopObj.offsetHeight); // stretch or contract inner right arc
elastic middle on y-axis
ilArcBotObj.style.top = yhig - ilArcBotObj.offsetHeight; // move
inner left arc bottom up or down
blBlueObj.style.top = yhig - blBlueObj.offsetHeight; // move
bottom left blue box up or down
centContObj.style.height = yhig - padY; // adjust height of center
content frame
irArcTilObj.style.height = yhig - (irArcBotObj.offsetHeight +
irArcTopObj.offsetHeight); // stretch or contract inner right arc
elastic middle on y-axis
irArcBotObj.style.top = yhig - irArcBotObj.offsetHeight; // move
inner right arc bottom up or down
brBlueObj.style.top = yhig - brBlueObj.offsetHeight; // move
bottom right gradient up or down

// outer right nav should be offset from bottom right
orightNavObj.style.left = xwid - 220; // move outer right nav bar
left or right
orightNavObj.style.top = yhig - 300; // move outer right nav bar up
or down
//}
}

 

[Martin Honnen]

OK, I know this issue has been beat to death, but I have tested my
script in Netscape 7.1 and it does seem to be getting the calculated
values it needs to create placement coordinates, and every example I
can find that 'works' in my netscape browser "appears" to use the same
style references to the various div objects that I am trying to use.
Yet even though I have verified the script is stepping through the
doResize subroutine, and the values are valid, nothing on my page gets
moved.

It works just great in IE6 but even with some cross browser
incompatibility, I would still expect that at least 'something' would
be modified in the netscape version but nuttin! What am I missing?
(and yes, I have compared my DOCTYPE definitions to those of
'functional' pages too)


var xwid = document.body.clientWidth;
var yhig = document.body.clientHeight;

While later versions of Netscape implement clientWidth/clientHeight you
should use
window.innerWidth
window.innerHeight
if you want your script to work with all versions of Netscape 4, 6, 7

olArcTilObj.style.height = yhig - (olArcBotObj.offsetHeight +
olArcTopObj.offsetHeight); // stretch or contract outer left arc
elastic middle on y-axis
olArcBotObj.style.top = yhig - (olArcBotObj.offsetHeight +
tlBlueObj.offsetHeight); // move outer left arc bottom up or down

CSS properties like height or left or top need a number plus a unit e.g.
in a stylesheet you use
height: 200px;
left: 10px;
and if you use script you need to do the same so you need to add units
to all those assignments e.g.
olArcTilObj.style.height =
yhig - (olArcBotObj.offsetHeight + olArcTopObj.offsetHeight) + 'px';