preloader installieren

freaky27

Grünschnabel
Hallo!
Ich habe in eurem Forum einen tollen Preloader gefunden und kann ihn nicht wirklich installieren.
Was muß ich ändern das der Preloader erst die index.html Seite ladet und dann anzeigt, denn bei mir ist kein Loader zu sehen wenn ich meine Seite aufrufe!?
ciao
freaky

HTML:
<html>
<head>
<script language="JavaScript1.2">
<!-- begin hiding
// (C) 2000 Marcin P Wojtowicz [one_spook@hotmail.com]. All rights reserved.
// Obtain permission before selling/redistributing in any medium.

startingColor = new Array() // <-- Do not modify!
endingColor = new Array() // <-- Do not modify!

// YOU MAY MODIFY THE FOLLOWING:
var yourImages = new Array("./Fotos/Foto2.jpg","./Fotos/Monikav.jpg","./Fotos/term-logo.jpg","./Fotos/cindyv.jpg","./Fotos/cindyf1.jpg","./Fotos/katze-lieb.jpg","./Fotos/Monika.jpg","./Fotos/anna.jpg","./Fotos/annav.jpg") // Fill this array with the images you wish to preload
var locationAfterPreload = "./Templates/home.htm" // The script will redirect here when the preloading finishes *successfully*
var preloadbarWidth = 350 // The length of the preload bar. Should be greater than total amount of images you want to preload!
var preloadbarHeight = 25 // The height of the gradient/preload bar
var backgroundOfGradient = "#0033CC" // Default color while the preload bar is "filling up"

// Color the preloadbar is starting with - enter 1st, 3rd and 5th numbers/letters of color code
startingColor[0] = "3" 
startingColor[1] = "0"
startingColor[2] = "5"

// Color the preloadbar is going to end up with - enter the 1st, 3rd and 5th numbers/letters of color code
endingColor[0] = "9"
endingColor[1] = "3"
endingColor[2] = "F"


// FOR TROUBLESHOOTING:
var gap = 5 // PLAY AROUND WITH THIS SETTING IF YOU GET A JAVASCRIPT ERROR 2 is the minumum value


// DO NOT MODIFY ANYTHING BEYOND THIS POINT

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 = "Geladen: " + currCount + " von " + imgLen + " Bildern [" + percent + "%].";
		pending--;
		checkLoad();
		return;
	}
	eval("document.all.cell" + (h+1) + ".style.backgroundColor = hilite[h]");;
	h++;
	setTimeout("changeto()",1);
}
defaultStatus = "Geladen 0 von " + imgLen + " Bildern [0%]."
// end hiding -->
</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head>
<body bgcolor="#000000"><font face="Verdana, Arial, Helvetica" size="2">
<div align="center">
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p><font color="#0066FF">Menü wird geladen... einen Moment bitte</font> 
    <script language="JavaScript1.2">
<!-- beging hiding
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="javascript:location.replace(locationAfterPreload)">Vorladen abbrechen</a></small></p></font>')
loadImages();
// end hiding -->
</script>
  </p>
</div>
</body>
</html>
 
Zuletzt bearbeitet von einem Moderator:
Willkommen im Forum.

Ich war mal so frei Deinen Code in die entsprechenden Tags zu setzen.
Nutze diese Moeglichkeit beim naechsten Mal bitte selbst.
Die entsprechenden Tags sind (Leerzeichen muessen aus den Beispielen entfernt werden):
[ php] [ /php]
[ code] [ /code]
[ html] [ /html]
 
Keine Ahnung, was bei dir schiefläuft?

Ich hab den Code da einfach so, wie er ist, genommen...und er hat funktioniert.
Dieser Preloader hat allerdings ein paar Haken:
  • wenn ein Bild nicht geladen werden kann, bleibt er hängen
  • wenn JS aus ist, geht garnichts...man kommt nicht zur Seite
  • man muss alle Bilder extra per Hand eingeben...das ist ein Haufen überflüssige Schreibarbeit und somit eine potentielle Fehlerquelle

Hier ist ein Preloader, der diese Probleme nicht hat: http://www.tutorials.de/tutorials196512.html
 

Neue Beiträge

Zurück