...

View Full Version : please wait box loading...



StealthRT
12-31-2007, 06:16 AM
Hey all i am trying to get the following code to start BEFORE the page starts loading... and then use the onload="" to end the overlay.

heres the code:


<html>
<head>
<title>Overlay</title>
<style type="text/css">

body {
margin: 0px;
}

#overlay {
background-image: url(http://www.pixeldepth.net/EE/Overlay/overlay.png);
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
}

</style>
<script type="text/javascript">
<!--

var overlay = {

click_on_overlay_hide: false,

show_loading_image: true,

loading_image: "http://www.pixeldepth.net/EE/Overlay/loading.gif",

$: function(id){
return document.getElementById(id);
},

init: function(){
var ol_div = document.createElement("div");

ol_div.id = "overlay";
ol_div.style.display = "none";
ol_div.onclick = (this.click_on_overlay_hide)? overlay.hide : null;

if(this.show_loading_image){
var l_img = document.createElement("img");

l_img.src = this.loading_image;
l_img.style.position = "absolute";
l_img.style.top = (((window.innerHeight)? window.innerHeight : document.body.clientHeight) / 2) + "px";
l_img.style.left = (((window.innerWidth)? window.innerWidth : document.body.clientWidth) / 2) + "px";

ol_div.appendChild(l_img);
}

document.body.appendChild(ol_div);
},

show: function(){
if(this.$("overlay")){
this.$("overlay").style.display = "";
}
},

hide: function(){
if(overlay.$("overlay")){
overlay.$("overlay").style.display = "none";
}
}

}
//-->
</script>
<script>

</script>
</head>
<body onload="setTimeout('overlay.hide()', 5000)">
<input type="button" onclick="overlay.init();overlay.show(); setTimeout('overlay.hide()', 5000)" value=" Click " /><br /><Br />
blah lbah lbah<br>
balkjsd<br>
dfsa<br>
dfas<br>
</body>
</html>

The overlay.init(); and overlay.show(); are needed to start the overlay. However, i am unable to start those without having a button to push doing so... which would defeat the purpose of having a loading box....

Any help to solve this problem would be great!:thumbsup:
David

brandonH
12-31-2007, 11:02 AM
you cannot do that. you are calling to the document object model before it exsists. the DOM does not exsist until the body tag is closed, well for javascript purposes and I.E. . the document and the elements in it cannot be accessed until the body is loaded into the browser.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum