Hi,
I'm having a LOT of trouble with this issue. First, check this site out:
The code I'm interested in is this:
window.onload = function() {
xGetElementById("MainContent").onresize = function() {adjustLayout();}
}
If you have a slow connection, you'll see that when you load the site, the contents overlap the footer. After the site is loaded, the footer gets bumped down to accomodate the larger contents.
And the same happens if you change the font size of your browser (i.e., Ctrl+Wheel).
Seems pretty straightforward. Now check this out:
(index.html)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<html xmlns="<head>
<title>Documento sin título</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script src="x_core.js" language="javascript" type="text/javascript"></script>
<script src="x_event.js" language="javascript" type="text/javascript"></script>
<script src="dhtml.js" language="javascript" type="text/javascript"></script>
</head>
<body>
<div id="container">
<div id="header">
<h1>Title</h1>
</div>
<div id="contents">these are the contents
<p> </p><p> </p>
<p> </p><p> </p>
</div>
<div id="sidebar">this is the sidebar
<p> </p><p> </p>
</div>
</div>
</body>
</html>
(dhtml.js)
window.onload = windowLoad;
function windowLoad() {
xAddEventListener(xGetElementById('sidebar'), "resize", test, false);
xAddEventListener(xGetElementById('contents'), "resize", test, false);
xAddEventListener(xGetElementById('container'), "resize", test, false);
xAddEventListener(document.body, "resize", test, false);
}
function test() {
alert("hi");
}
If you test that, you'd expect to get a "hi" message when you change font sizes, but you won't. I've tried many approachs and variations...
I'm baffled.
Does anyone know how to make it work? Why does it work on the sample site and not on my code?
BTW, the "x" functions are standard functions you can find on and in case you wonder, I know those aren't the problem. It would be the same as using getElementById and assigning the events on the fly, as in object.onresize = function.
Also, I've tried this on both IE6 SP1 and on Firefox.
Any help I'd really appreciate!
Thanks in advance!
- Ivan V.
I'm having a LOT of trouble with this issue. First, check this site out:
The code I'm interested in is this:
window.onload = function() {
xGetElementById("MainContent").onresize = function() {adjustLayout();}
}
If you have a slow connection, you'll see that when you load the site, the contents overlap the footer. After the site is loaded, the footer gets bumped down to accomodate the larger contents.
And the same happens if you change the font size of your browser (i.e., Ctrl+Wheel).
Seems pretty straightforward. Now check this out:
(index.html)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<html xmlns="<head>
<title>Documento sin título</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script src="x_core.js" language="javascript" type="text/javascript"></script>
<script src="x_event.js" language="javascript" type="text/javascript"></script>
<script src="dhtml.js" language="javascript" type="text/javascript"></script>
</head>
<body>
<div id="container">
<div id="header">
<h1>Title</h1>
</div>
<div id="contents">these are the contents
<p> </p><p> </p>
<p> </p><p> </p>
</div>
<div id="sidebar">this is the sidebar
<p> </p><p> </p>
</div>
</div>
</body>
</html>
(dhtml.js)
window.onload = windowLoad;
function windowLoad() {
xAddEventListener(xGetElementById('sidebar'), "resize", test, false);
xAddEventListener(xGetElementById('contents'), "resize", test, false);
xAddEventListener(xGetElementById('container'), "resize", test, false);
xAddEventListener(document.body, "resize", test, false);
}
function test() {
alert("hi");
}
If you test that, you'd expect to get a "hi" message when you change font sizes, but you won't. I've tried many approachs and variations...
I'm baffled.
Does anyone know how to make it work? Why does it work on the sample site and not on my code?
BTW, the "x" functions are standard functions you can find on and in case you wonder, I know those aren't the problem. It would be the same as using getElementById and assigning the events on the fly, as in object.onresize = function.
Also, I've tried this on both IE6 SP1 and on Firefox.
Any help I'd really appreciate!
Thanks in advance!
- Ivan V.
