Bilder vorladen (Image Preloader) mit Javascript
Wenn Ihre Homepage ein aufwendiges, grafisches Menü besitzt oder Sie viele Grafiken auf Ihrer Webseite einsetzen, können Sie mit diesem einfachen Javascript auf der ersten Seite Bilder vorladen, die der Besucher erst auf späteren Unterseiten zu sehen bekommt.
Vielfach ist es nicht der reine Quellcode, der die Ladezeit einer Webseite in die Länge zieht, oft sind es die verwendeten Bilder. Dabei ist es möglich, Bilder mit Hilfe des folgenden Javascripts bereits vorzuladen, d.h. die Bilder werden auf der ersten Seite heruntergeladen und beim späteren Aufruf auf einer der nächsten Seiten kommen sie blitzschnell aus dem Cache des Browsers.
<html>
<head>
<script language="JavaScript">
<!--
function BilderVorladen()
{
document.Vorladen = new Array();
if(document.images)
{
for(var i = 0; i < BilderVorladen.arguments.length; i++)
{
document.Vorladen[i] = new Image();
document.Vorladen[i].src = BilderVorladen.arguments[i];
}
}
}
//-->
</script>
<title>Bilder vorladen (Image Preloader)</title>
</head>
<body onLoad="BilderVorladen('bild1.jpg','bild2.gif');">
Die Bilder der nächsten Seiten werden vorgeladen, während Sie diesen Text lesen.
</body>
</html>
Rufen Sie die Funktion BilderVorladen(…) mit Hilfe des BODY-Tag-Attributes onLoad=”BilderVorladen(…)” auf und übergeben Sie ihr die vorzuladenden Dateien. Dabei können Sie der Funktion beliebig viele Bilder übergeben.
Kategorie: Javascript
