Board3

this is a simple loader script for your forum or webpage, this let your visitors know that the webpage they are about to see is getting loaded.
dont forget to backup your files before editing it!

1 files to modify
-overall_header.html

im using the prosilver template, but this work with any forum style.

Step #1

first locate the overall_header.html in root/styles/prosilver/template
open it with notepad++
Insert the following javascript inside the <head></head> tag:

<script type="text/javascript" language="javascript">
function is_loaded() { //DOM
if (document.getElementById){
document.getElementById('preloader').style.visibility='hidden';
}else{
if (document.layers){ //NS4
document.preloader.visibility = 'hidden';
}
else { //IE4
document.all.preloader.style.visibility = 'hidden';
}
}
}
//-->
</script>

Step #2

Now replace the <body id="phpbb" class="section-{SCRIPT_NAME} {S_CONTENT_DIRECTION}">

by: <body onload="is_loaded();" id="phpbb" class="section-{SCRIPT_NAME} {S_CONTENT_DIRECTION}">

Step #3

insert this html code just under the <body onload="is_loaded();" id="phpbb" class="section-{SCRIPT_NAME} {S_CONTENT_DIRECTION}">tag:

<div id="preloader" style="position:absolute; left:30%; top:290px; width:380px; height:120px;">
<center>
<table border="0" align="center" cellpadding="6" cellspacing="0" style="font-family:Arial, Verdana; border: 2px solid #006633;">
<tr>
<td style="text-align:center; background-color:#ffffff">
<font style="font-size:120px; font-weight:bold; color:#0099ff">!</font>
</td>
<td style="text-align:center; background-color:#0099ff">
<font style="font-size:28px; color:#ffffff; text-align:center;">Loading ... please wait</font>
</td>
</tr>
</table>
</center>
</div>

costumize it to your language by changing: "Loading ... please wait" for the language you want.

enjoy!

exemple: Click here

Board3

Javascript Preloader for your forum and forum portal

Javascript Preloader for your forum and forum portal