There has been a bit of work done to get an init() function to run when
the DOM is complete but before all the images have been downloaded. The
idea is to kickoff init() scripts when all the elements are there but
not wait for large images.
Below is a script which uses 3 different techniques, one each for IE,
Safari and Mozill/Opera 9. The Safari version uses browser sniffing,
but I think with a little work that could be removed - the following
code is really just a proof of concept.
My simple solution is to insert a script element that calls the init
function just before the closing body tag. It seems just as good to me,
always runs before the above methods, is far less code and likely to run
more consistently in more browsers. What do others think?
Script:
<title>Onload </title>
<script type="text/javascript">
function init(s){
if (!this.init.cal led) {
this.init.calle d = true;
document.getEle mentById('xx'). innerHTML += s;
}
}
init.called = false;
/* for Internet Explorer (using conditional comments)
* From Matthias Miller:
*
http://www.outofhanwell.com/blog/ind...blem_revisited
*/
/*@cc_on @*/
/*@if (@_win32)
document.write( "<script id=__ie_onload defer "
+ "src=javascript :void(0)><\/script>");
var script = document.getEle mentById("__ie_ onload");
script.onreadys tatechange = function() {
if (this.readyStat e == "complete") {
init('IE version'); // call the onload handler
}
};
/*@end @*/
/* for Mozilla and Opera 9 browsers
* From Dean Edwards:
* http://dean.edwards.name/weblog/2005/09/busted/
*/
if (document.addEv entListener) {
document.addEve ntListener(
"DOMContentLoad ed",
function(){init ('Mozilla & Opera 9 version');},
false
);
}
/* Safari/Webkit version
* From John Resig (author of jQuery)
*/
if (/WebKit/i.test(navigato r.userAgent)) { // sniff
var _timer = setInterval(fun ction() {
if (/loaded|complete/.test(document. readyState)) {
clearInterval(_ timer);
init('Safari/Webkt version'); // call the onload handler
}
}, 10);
}
</script>
<body>
<div id="xx"></div>
<img src="http://www.space.com/images/ig320_mcnaught_ Boomer_02.jpg">
<!-- If uncommented, the following script runs before the others -->
<script type="text/javascript">
// init('Footer script used');
</script></body>
--
Rob
