Preloader mit Bilder gestalten ?

Nightshadow

Mitglied
hallo,
hab in Eurem Forum ein supi Preload-Script gefunden. Funktioniert einwandfrei und ist zudem auch noch perfekt kommentiert, danke, danke, danke. :p
Hier das script:
Code:
----------------------------------------------------------------------------------------------------------------
<script>
function stoperror(){
return true
}
window.onerror=stoperror
</script>
<script language="JavaScript1.2">
<!--
// (C) 2000 Marcin P Wojtowicz [one_spook@hotmail.com]. All rights reserved.

startingColor = new Array()
endingColor = new Array()

// hier steht die Modifikation
var yourImages = new Array("../laden5.jpg","../laden6.jpg","../laden7.jpg","../laden8.jpg") 	// Bilder die zu laden sind
var locationAfterPreload = "../laden2.html"			// Seite die dann geladen werden soll
var preloadbarWidth = 220 				// Länge des Ladebalken
var preloadbarHeight = 15			 	// Höhe des Ladebalken
var backgroundOfGradient = "#000000" 			// Hintergrundfarbe des Ladebalken

// Anfangsfarbe des Ladebalken
startingColor[0] = "f"
startingColor[1] = "f"
startingColor[2] = "0"

// Endfrabe des Ladebalken
endingColor[0] = "c"
endingColor[1] = "0"
endingColor[2] = "0"

var gap = 1   							// feinheit der Farbstreifen im Balken


// Ab hier nichts mehr verändern!

if (!document.all) location.replace(locationAfterPreload)
var a = 10, b = 11, c = 12, d = 13, e = 14, f=15, i, j, ones = new Array(), sixteens = new Array(), diff = new Array();
var convert = new Array("0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f"), imgLen = yourImages.length;
var loaded = new Array(), preImages = new Array(), currCount = 0, pending = 0, h = 0, hilite = new Array(), cover = new Array();
var num = Math.floor(preloadbarWidth/gap);
for (i = 0; i < 3; i++) {
	startingColor[i] = startingColor[i].toLowerCase();
	endingColor[i] = endingColor[i].toLowerCase();
	startingColor[i] = eval(startingColor[i]);
	endingColor[i] = eval(endingColor[i]);
	diff[i] = (endingColor[i]-startingColor[i])/num;
	ones[i] = Math.floor(diff[i]);
	sixteens[i] = Math.round((diff[i] - ones[i])*15);
}
endingColor[0] = 0;
endingColor[1] = 0;
endingColor[2] = 0;
i = 0, j = 0;
while (i <= num) {
	hilite[i] = "#";
	while (j < 3) {
		hilite[i] += convert[startingColor[j]];
		hilite[i] += convert[endingColor[j]];
		startingColor[j] += ones[j];
		endingColor[j] += sixteens[j];
		if (endingColor[j] > 15) {
			endingColor[j] -= 15;
			startingColor[j]++;
		}
		j++;
	}
	j = 0;
	i++;
}
function loadImages() {
	for (i = 0; i < imgLen; i++) {
		preImages[i] = new Image();
		preImages[i].src = yourImages[i];
		loaded[i] = 0;
		cover[i] = Math.floor(num/imgLen)*(i+1)
	}
	cover[cover.length-1] += num%imgLen
	checkLoad();
}
function checkLoad() {
	if (pending) { changeto(); return }
	if (currCount == imgLen) { location.replace(locationAfterPreload); return }
	for (i = 0; i < imgLen; i++) {
		if (!loaded[i] && preImages[i].complete) {
			loaded[i] = 1; pending++; currCount++;
			checkLoad();
			return;
		}
	}
	setTimeout("checkLoad()",10);
}
function changeto() {
	if (h+1 > cover[currCount-1]) {
		var percent = Math.round(100/imgLen)*currCount;
		if (percent > 100) while (percent != 100) percent--;
		if (currCount == imgLen && percent < 100) percent = 100;
		defaultStatus = "Loaded " + currCount + " out of " + imgLen + " images [" + percent + "%].";
		pending--;
		checkLoad();
		return;
	}
	eval("document.all.cell" + (h+1) + ".style.backgroundColor = hilite[h]");;
	h++;
	setTimeout("changeto()",1);
}
defaultStatus = "Loaded 0 out of " + imgLen + " images [0%]."
// -->
</script>
</head>
<body>
<center>
<font face="Verdana, Arial, Helvetica" size="2"><center><b>Lade Grafiken...</b> <br><br>Bitte warten..<br><br></center>

<script language="JavaScript1.2">
<!--
document.write('<table border="0" cellpadding="0" cellspacing="0" width="' + preloadbarWidth + '"><tr height="' + preloadbarHeight + '" bgcolor="' + backgroundOfGradient + '">');
for (i = 0; i < num; i++) {
	document.write('<td width="' + gap + '" id="cell' + (i+1) + '"></td>');
}
document.write('</tr></table>');
document.write('<p><small><a href="lade2.php3">Non Stop </a></small></p></font>')
loadImages();
// -->
</script>

----------------------------------------------------------------------------------------------------------------

Nun meine Frage.
Kann man anstelle des Ladebalkens eine Grafik verwenden, die dann von links nach rechts wandert?

Wenn dieses Script nicht dafür geeignet ist, vieleicht kennt jemand ja ein gesuchtes und kann mir helfen.

Vielen Dank schonmal für Eure Hilfe
 
Hallo,
mir ist grad aufgefallen das dieses Script im IE unten als Status die Anzahl der geladenen Bilder sowie die Prozent ausgibt. Ich find das klasse aber dieser status wird über die gesamte Hp angezeigt.

"Window.Status="........."" ist auf jeder Seite vorhanden und dennoch wird der Status des Preloadscripts angezeigt.

Kann man das ändern ?
 
nachtrag

Hab als index Seite ein Frameset wegen der url.
Wenn ich Dieses Frameset entferne wird im IE Status wieder mein eingegebener Status angezeigt. Denke es hat wohl damit zu tun.

Kann mir denn keiner helfen ?
 
Zurück