object width and browser compatibility

D

David McDivitt

resending with better URL

At the URL http://www.spfldcycling.org/miles/06_12_detail.htm , I'm having
difficulty resizing a DIV object when the window resizes. I want to get the
left and top positions of the DIV, then calculate the width and height. I
can get the window dimensions fine, but since I can't get the left and top I
had to use constants, which isn't a good idea. Also, the page doesn't work
well in Netscape. The header shifts all the way to the right on top of the
empty corner cell, and the name list sometimes disappears and comes back
again if resized in the other axis. IE is fine. If someone could look at
this and give me suggestions I'd appreciate it. The function with constants
is pasted below.

The page is created by a VB6 program and uploaded via FTP. I put it out with
a debug switch set, so extra spaces and line feeds are included. If the
records keeper uploads again, those will go away, but for the time being the
page source can be easily read.

function redraw() {
if (dd) {
var ww=f_clientWidth();
var wh=f_clientHeight();
if (ww<500) ww=500;
if (wh<500) wh=500;
dd.style.width=ww-160;
dd.style.height=wh-175;
hh.style.width=ww-175;
nn.style.height=wh-190;
}
}

dd is set at the end of the page by:

var hh=document.getElementById('head');
var nn=document.getElementById('names');
var dd=document.getElementById('detail');
 
D

David McDivitt

From: David McDivitt said:
Date: Sat, 23 Dec 2006 15:55:51 -0600
Lines: 39

resending with better URL

At the URL http://www.spfldcycling.org/miles/06_12_detail.htm , I'm having
difficulty resizing a DIV object when the window resizes. I want to get the
left and top positions of the DIV, then calculate the width and height. I
can get the window dimensions fine, but since I can't get the left and top I
had to use constants, which isn't a good idea. Also, the page doesn't work
well in Netscape. The header shifts all the way to the right on top of the
empty corner cell, and the name list sometimes disappears and comes back
again if resized in the other axis. IE is fine. If someone could look at
this and give me suggestions I'd appreciate it. The function with constants
is pasted below.

The page is created by a VB6 program and uploaded via FTP. I put it out with
a debug switch set, so extra spaces and line feeds are included. If the
records keeper uploads again, those will go away, but for the time being the
page source can be easily read.

function redraw() {
if (dd) {
var ww=f_clientWidth();
var wh=f_clientHeight();
if (ww<500) ww=500;
if (wh<500) wh=500;
dd.style.width=ww-160;
dd.style.height=wh-175;
hh.style.width=ww-175;
nn.style.height=wh-190;
}
}

dd is set at the end of the page by:

var hh=document.getElementById('head');
var nn=document.getElementById('names');
var dd=document.getElementById('detail');


I resolved the position issue with the code pasted below. I forgot the left
values were relative to the parent. And for some reason, Netscape works now,
too! I didn't change the part Netscape didn't like but what the hell. If
resized too small horizontally, Netscape will squeeze the name column, then
not restore if sized back out again. With Netscape the DIV ending sizes
leave different space to the edge of the window, varying randomly from one
resize to the next, but it doesn't look bad. It's just not consistent in
Netscape. But I'm happy. A constant of 10 gives a nice margin to the window.
The constant of 25 is 10 plus the width of the scrollbar.

function redraw() {
if (dd) {
var ww=f_clientWidth();
var wh=f_clientHeight();
if (ww<500) ww=500;
if (wh<500) wh=500;
var calc=ww-left(dd)-10;
if (dd.style.width!=calc) dd.style.width=calc;
calc=wh-top(dd)-10;
if (dd.style.height!=calc) dd.style.height=calc;
calc=ww-left(hh)-25;
if (hh.style.width!=calc) hh.style.width=calc;
calc=wh-top(nn)-25;
if (nn.style.height!=calc) nn.style.height=calc;
}
}
function left(ob) {
var sum=0;
var o=ob;
while (o) {
sum+=o.offsetLeft;
o=o.offsetParent;
}
return sum;
}
function top(ob) {
var sum=0;
var o=ob;
while (o) {
sum+=o.offsetTop;
o=o.offsetParent;
}
return sum;
}
 
D

David McDivitt

From: David McDivitt said:
Date: Sat, 23 Dec 2006 19:40:35 -0600
Lines: 89

I resolved the position issue with the code pasted below. I forgot the left
values were relative to the parent. And for some reason, Netscape works now,
too! I didn't change the part Netscape didn't like but what the hell. If
resized too small horizontally, Netscape will squeeze the name column, then
not restore if sized back out again. With Netscape the DIV ending sizes

At this page http://www.spfldcycling.org/miles/06_12_detail.htm , I noticed
the text screws up when scrolling horizontally, in IE, if the browser zoom
is not 100%. The text screws up but the cell borders travel where they
should. Now I have to include a note saying to insure zoom is 100%. Is there
a way to see what the zoom value is so I can display a warning?
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,744
Messages
2,569,483
Members
44,902
Latest member
Elena68X5

Latest Threads

Top