JS Show a pic when site is loading.

gaptrast

gaptrast

Member
Messages
123
Reaction score
0
Points
16
Hello, I need to have this on my site: When the site is loading appear a image like "please wait until the site load", and when it has finhished it says "you have succesffully loaded the page". How can I get this work? ( can I use Javascript?) Regards
 
vishal

vishal

-::-X10 Guru-::-
Community Support
Messages
5,255
Reaction score
192
Points
63
If you have a page that takes long time to display it is a good idea to display a "wait until the page loads" image. Try this
To implement this you will need to:

1. Every time your page loads a "init()" function will load.

<body onLoad="init()">

2. Define a div named "loading" right after <body> section.

<div id="loading" style="position:absolute; width:100%; text-align:center; top:300px;">
<img src="loading.gif" border=0></div>

The loading.gif image should be an animated gif that suggests that the page is still loading.

3. Place this javascript code right after you define the div.

<script>
var ld=(document.all);
var ns4=document.layers;
var ns6=document.getElementById&&!document.all;
var ie4=document.all;
if (ns4)
ld=document.loading;
else if (ns6)
ld=document.getElementById("loading").style;
else if (ie4)
ld=document.all.loading.style;
function init()
{
if(ns4){ld.visibility="hidden";}
else if (ns6||ie4) ld.display="none";
}
</script>
Click to expand...

DONT FORGET TO REP
 
Last edited:
S

slacker3

New Member
Messages
146
Reaction score
6
Points
0
Wouldn't onLoad be triggered when the document is finished loading ?
 
vishal

vishal

-::-X10 Guru-::-
Community Support
Messages
5,255
Reaction score
192
Points
63
is ur browser javascript supported
 
vishal

vishal

-::-X10 Guru-::-
Community Support
Messages
5,255
Reaction score
192
Points
63
i recommend that u use firefox
 
vishal

vishal

-::-X10 Guru-::-
Community Support
Messages
5,255
Reaction score
192
Points
63
no javascrit suppoted browsers
 
S

slacker3

New Member
Messages
146
Reaction score
6
Points
0
vishal2 said:
nope., it was woking fine
Click to expand...

i believe you on that

but you can read on several sources the onload event will be triggered
immediately after the page has finished loading:
http://www.w3.org/TR/REC-html40/interact/scripts.html#adef-onload
http://www.w3schools.com/jsref/event_onload.asp
http://www.javascriptkit.com/javatutors/event3.shtml
http://www.devguru.com/Technologies/ecmascript/quickref/evhan_onload.html


your example shouldn't work..
(or should it?) :confused:


EDIT:
now i got it.. sorry for my stupid questions :)
the first answer confused me a little bit
 
Last edited:
descalzo

descalzo

Grim Squeaker
Community Support
Messages
9,373
Reaction score
326
Points
83
slacker3 said:
your example shouldn't work..
(or should it?) :confused:
Click to expand...

The script he got from the web should work.

The init() function assigned to the onload event handler hides the "loading" gif once it is no longer needed. And if there is no JS (not available or turned off), the gif stays there.
 
M

misson

Community Paragon
Community Support
Messages
2,572
Reaction score
72
Points
48
vishal2 said:
<script>
var ld=(document.all);
var ns4=document.layers;
var ns6=document.getElementById&&!document.all;
var ie4=document.all;
...
Click to expand...
Click to expand...
Wow, that's ancient. NS 4 and IE 4 are long dead. The script doesn't strictly speaking use browser sniffing, but close to it. "init" is a rather generic name; it can easily conflict with functions defined in external scripts. The code can be reduced to:
Code: 
<body onload="hideLoading">
...
<script type="text/javascript">
function hideLoading() {
     document.getElementById("loading").style.display='none';
}
</script>

Since the original request was underspecified, this may not fulfill the OP's needs.


gaptrast said:
Thanks it works but only when I go to the site. When I load something after the site has been loading, it do not show. Look here:: http://larspedia.x10hosting.com/new/new.html (example)
Click to expand...

Looks like your site has been hit with rogue advertising. Run malware scans on your computer, change your passwords and remove the "<iframe src="http://qiprox.com/index.php?e=allow_hotlink" height="1" width="1"></iframe>" from the page. Go over the other pages with a fine-toothed comb.
 
Last edited:
gaptrast

gaptrast

Member
Messages
123
Reaction score
0
Points
16
The iframe was there only because to get some more to load on my site! If you go to the site you will see the picture when the pages load, BUT if the site load later (when you go to yahoo.com in the form,iframe) the picture does not show.?!?"??#=
 
descalzo

descalzo

Grim Squeaker
Community Support
Messages
9,373
Reaction score
326
Points
83
Looks like your site has been hit with rogue advertising. Run malware scans on your computer, change your passwords and remove the "<iframe src="http://qiprox.com/index.php?e=allow_hotlink" height="1" width="1"></iframe>" from the page. Go over the other pages with a fine-toothed comb.
Click to expand...


The iframe was there only because to get some more to load on my site!
Click to expand...

Read what he said. Did you have that address as the source of your iframe? Did you have it 1x1? Did you actually visit the page again?
 
Last edited:
You must log in or register to reply here.
Top