Vorladen der kompletten Webseite

C

code-schreiber

Grünschnabel
Sehr geehrte Herren,

ich bin auf der Suche nach einem JavaScript, mit welchem ich alle Bilder meiner Homepage 'vorladen' kann, sodass die Webseite komplett angezeigt wird und die Bilder nicht einzeln geladen werden.

Bei der Suche in Ihrem Forum fand ich nur einen Thread, bei dem ein Entwickler die Bilder seiner Homepage vorlud, indem er sie in ein Java-Script-Array geschrieben hatte. Jetzt ist es aber bei mir so, dass ich nicht weiss, wieviele Bilder es auf der Webseite von mir geben wird, vorallem benutze ich viele kleine Bilder, sodass ich von einer Version absehe die die Bilder nur per Namen vorlädt, da es eine grosse Menge wäre die man in das Array schreiben müsste.

Lieber wäre mir eben ein bestimmtes Script, mit dem einfach alle Bilder geladen werden, und erst dann die Homepage angezeigt wird. Etwas Ähnliches habe ich schonmal gesehen, da zeigte sich einfach ein 'Loading-Screen' und danach ploppte die Webseite komplett geladen dahinter auf.

Wenn Sie für mich einen intressanten Link hätten, wäre ich Ihnen sehr dankbar.

Mit freundlichen Grüssen

code-schreiber -
 
Hallo,

vielleicht kannst du mir follgendem Ansatz anfreunden:
Code: 
<html>
<head>
  <script type="text/javascript">
      function preload(){
        document.getElementById('preload').style.display = 'none';
      }
  </script>
</head>
<body onLoad="preload()">
<span style="width:100%; height:100%; top:0px; left:0px; background-color:#fff; position:absolute; z-index:1; display:block;" id="preload">
now loading
</span>

<img src="http://images.deviantart.com/i/9/0/f/Annihilation.jpg">
</body>
</html>
Das Skript wartet bis die ganze Seite geladen wurde, und versteckt dannach einen Layer, welcher über die ganze Seite gelegt wurde...

bye

//edit: hab hier im Beispiel ein extra großes Bild verlinkt um den Effekt besser demonstrieren zu können...
 
Zusatzfrage

Das gefällt mir auch!

Wie kann man denn das so gestalten, dass sich sowohl Fotos als auch Webseiten Preloaden?
 
Ich will eine ganze Seite preloaden und zusätzlich auch ein Foto (das dann über diese neue - also nächste - Seite geöffnet werden kann. Es geht um die Seite Barhocker

Es ist von dort eine Preisliste erreichbar (HTML) und eine Bilddatei für die lieferbaren Farben. Beides soll vorgeladen (aber nicht automatisch geöffnet) werden.

DANKE!

Manfred
 
Aha... Du könntest z.B. die Seite die geladen werden soll in nen Iframe stecken. Müsste sogar mit dem Code oben zusammenarbeiten...
PHP: 
<iframe src="datei_zum_laden.html" style="position:absolute;left:-1000px;top:-1000px"></iframe>
<!-- Ich verwende hier kein "display:none;", weil es durchaus sein könnte, das Browser Seiten die nicht angezeigt werden, auch nicht laden...-->
 
Danke,

was ein iframe ist weiss ich zwar (noch) nicht, aber das alles hier in Sachen "preload" erscheint mir sehr kompliziert. Ich habe schon 500 Beiträge gelesen und kenn mich nun überhaupt nicht mehr aus (ist auch kein Wunder denn ich bin von Beruf Schreiner).

Da muss es aber doch irgendwo einen ganz einfachen Befehl geben der eine ganze HTML-Seite preloaden kann, und zusätzlich auch einen Befehl der ein Foto preloadet. Oder?

Manfred
 
Code: 
<script type="text/javascript">
<!--
//Bild vorladen
hocker=new Image();hocker.src='hocker.jpg';

//Seite bis zum Onload verbergen
function showDoc()
{
document.getElementsByTagName('body')[0].style.visibility='visible';
}
if(document.getElementsByTagName)
	{
	document.writeln('<style type="text/css"><!--');
	document.writeln('body{visibility:hidden;}');
	document.writeln('--></style>');
	window.onload=showDoc;
	}
//-->
</script>
Das ganze gehört in den <head>
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück