Dette skal være index.html
<html>
<head>
<script>
var pics = new Array("dog1.jpg", "dog2.jpg", "dog3.jpg", "dog4.jpg", "dog5.jpg" ,"a.gif", "b.gif", "c.gif", "d.gif", "e.gif", "f.gif", "g.gif", "h.gif", "i.gif", "j.gif", "k.gif", "l.gif", "m.gif", "n.gif", "freefoto.gif");
var url = "done.html";
var doConfirm = true;
var canSkip = false;
var imgObjs = new Array(pics.length);
var loaded = 0;
var total = pics.length;
var cPercent = 0;
var barLayer = null;
var percentLayer = null;
var statLayer = null;
var doneMsgLayer = null;
function getLayer(layerID) {
if (document.getElementById)
return document.getElementById(layerID);
else if (document.all)
return document.all[layerID];
else
return null;
}
function updateBar() {
statLayer.innerHTML = "<font face=\"Arial\" color=\"#FFFFFF\"><B>" +loaded+ "/" +total+ "</B></font>";
var percent = Math.round(loaded/total * 100);
if (cPercent != percent)
{
cPercent = percent;
barLayer.style.width = (cPercent*3) +"px";
percentLayer.innerHTML = "<font color=\"#BBBB00\"><B>" +cPercent+ "%</B></font>";
}
if (loaded == total)
{
doneMsgLayer.innerHTML = "<a href=\"java script:done()\"><font face=\"Arial\" color=\"#FFCC00\" size=\"2\"><B>Done (Click Here)</B></font></a>";
if (!doConfirm || (doConfirm && confirm("Files have finish loading, continue to next page?")))
done();
}
}
function startLoading() {
if (document.getElementById || document.all)
{
barLayer = getLayer("bar");
percentLayer = getLayer("percent");
statLayer = getLayer("stat");
doneMsgLayer = getLayer("doneMsg");
if (canSkip)
doneMsgLayer.innerHTML = "<a href=\"java script:done()\"><font color=\"#FFCC00\" size=\"2\" face=\"Arial\">Skip Pre-Loading</font></a>";
for (i=0; i<pics.length; i++)
{
imgObjs[i] = new Image();
imgObjs[i].onload = imgLoaded;
imgObjs[i].onerror = imgFailed;
imgObjs[i].src = pics[i];
}
}
else
{
alert("You are likely running very old browser which is not compatible with preloading script. Maybe it is time to update your browser.\n\nProgram is skipping preloading.");
window.location.replace(url);
}
}
function done() {
window.location.replace(url);
}
function imgFailed() {
alert("The following image failed to load, probably a broken link:\n" +this.src+ "\nPlease contact the webmaster of the site you are visiting about this. The program will skip this file now.");
loaded++;
updateBar();
}
function imgLoaded() {
loaded++;
updateBar();
}
</script>
</head>
<body bgcolor="#002080" onLoad="startLoading()">
<div id="msg" style="position:absolute; top:0px; left:50px; width:200px; height:20px;"> <font face="Arial" size="4" color="#DDDDDD">Loading...</font></div>
<div id="bg" style="position:absolute; top:0px; left:200px; background-color: #DDDDDD; width:300px; height:20px;"> </div>
<div id="bar" style="position:absolute; top:0px; left:200px; background-color: #000000; width:1px; height:20px;"> </div>
<div id="percent" style="position:absolute; top:0px; left:330px;"><font color="#BBBB00"><B>0%</B></font></div>
<div id="stat" style="position:absolute; top:0px; left:520px;"><font face="Arial" color="#FFFFFF"><B>0/0</B></font></div>
<div id="doneMsg" style="position:absolute; top:0px; left:620px;"></div>
<div id="doneMatter" style="position:absolute; top:30px; left:0px; width:700px;">
<center><font color="#FFFFFF" face="Arial" size="2">Please wait while the computer preloads some files for you.</font></center><BR>
</body>
</html>
Og denne skal hedde done.html
<html>
<head>
<title>Page Done</title>
</head>
<body>
<img src="a.gif">
<img src="b.gif">
<img src="c.gif">
<img src="d.gif">
<img src="e.gif">
<img src="f.gif">
<img src="g.gif">
<img src="h.gif">
<img src="i.gif">
<img src="j.gif">
<img src="k.gif">
<img src="l.gif">
<img src="m.gif">
<img src="n.gif"><BR><BR><BR>
I like dogs :)<BR>
<img src="dog1.jpg">
<img src="dog2.jpg">
<img src="dog3.jpg">
<img src="dog4.jpg">
<img src="dog5.jpg"><BR>
Der er ingen billeder, men dem kan du jo selv lave...
</body>
