Forum Moderators: open
In a Javascript Reference Manual I found the following:
(...)
From a scripting point of view, it is important to know that while a style object's property exhibits a default behaviour (a font size or alignment), the default value may not be reflected in the property unless the value has been explicitly set in the element tag's STYLE
(...)
So, admiting I use something like:
<style type="text/css">
#sample_id {
position:absolute;
left:167px;
top:373px;
width:144px;
height:61px;
}</style>
</head>
<script type="text/javascript" language="javascript">
function onWindowResize()
{
// myValue will be set to zero because the property cannot be accessed as it was not initialized inside the style clause (?)
var myValue = document.all.sample_id.style.pixelTop
}
</script>
<div id="sample_id">
<img src="images/bkg_01.jpg" width="231" height="234"></div>
... this means I won't be able to access sample_id's property values in the script above because its properties were not initialized in the style clause, inside the <DIV> tag.
Does anyone know if there is a logical reason for this to work this way? I feel this is very annoying and somewhat illogic, does anyone feel the same way as me?
What I would like to know is if there is a way of accessing the tag's properties without having to initialize them in the style clause.
Any suggestions?
Thank you a lot for your time! 8 )
D#Nimrod
The pre-load phase is useful for inserting dynamic content like cookie values or the user's ip address on the page. In this phase the document.write method is available. I also use this for creating dynamic style tags.
After the page has loaded, then you can manipulate the page using the DOM. I consider this Dynamic HTML (DHTML) - this is where you want to call your function. In order to make your functions happen after the page has loaded, they need to be called from events: onClick, onMouseOver, onLoad, etc. The OnLoad function is the one that is called after the page has been created, when the browser switches to post-load mode.
So, you want to call your onWindowResize function this way
<body onLoad="onWindowResize()">
If you want some good examples, I've got a Javascript Windows project at [bitesizeinc.net...] with source code you can download that demonstrates this.
However, other events (such as onMouseover) are not uniformly available cross-browser for all page elements. Even in different versions of the same browser the support will vary.
As I understand it, preload is not a formal coding reference - it's a convenient label that refers to anything that occurs before the page is fully loaded.
So you mean there is no preload event or such. Instead we have to be happy to use OnLoad? What about if we want to do any kind of pre-load processing operations before the page is actually displayed? Is there any way to do this which is fully supported by all browsers?
david
What about if we want to do any kind of pre-load processing operations before the page is actually displayed? Is there any way to do this which is fully supported by all browsers?
Now, use the onLoad event to call a function that does all the size calculations. Once all the sizing is done, the function then sets visibility="visible" for the div.
This is a bit of a hack, but a hack is better than no solution at all. I know that IE re-renders the content (with new sizes!) when you set the visiblility property to visible. Test it in other browsers, I'm 99% sure it'll work in Netscape too.