pcworld: Diashow: Im Voraus geladene Bilder werden erneut geladen

Beitrag lesen

Hallo!

Ich habe eine Diashow mit JavaScript erstellt.
Die ganzen Bilder sollen alle, bevor sie angezeigt werden, schon geladen werden. Das tun sie auch.
Doch wenn mit der Blätter-Funktion der Diashow weitergeblättert wird, wird das Bild noch einmal vom Server heruntergeladen, obwohl es im Cache des Browsers noch gespeichert sein müsste.
Hab es mit Firefox und dem Live HTTP Headers-Plugin getestet.

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
<head>  
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">  
<title>Diashow-Problem</title>  
<script type="text/javascript">  
var Bild = new Array();  
  
Bild[0] = "http://www.abload.de/img/1_snapshotpi7lxdcc.png";  
Bild[1] = "http://www.abload.de/img/updater3kip8ck3.png";  
Bild[2] = "http://www.abload.de/img/1_snapshotg4r.png";  
  
var img = new Array();  
var aTag;  
var imgTag;  
  
var bildbereich;  
var zeige = 0;  
  
function Blaettern (Richtung) {  
  zeige = zeige + Richtung;  
  if (zeige > Bild.length - 1) {  
    zeige = 0;  
  } else if (zeige < 0) {  
    zeige = Bild.length - 1;  
  }  
   showPic();  
}  
  
function showPic() {  
 aTag.href = Bild[zeige];  
 imgTag.src = img[zeige].src;  
}  
  
function Init () {  
 bildbereich = document.getElementById("Bildbereich");  
  
 aTag = document.createElement("a");  
 aTag.target = "_blank";  
 imgTag = document.createElement("img");  
 imgTag.alt = "Bild";  
 imgTag.border = "border: 0px;";  
 aTag.appendChild(imgTag);  
 bildbereich.appendChild(aTag);  
  
 for(var i = 0; i < Bild.length; i++) {  
  img[i] = new Image();  
  img[i].src = Bild[i];  
 }  
  
 showPic();  
}  
</script>  
<style type="text/css">  
body { color:black; background-color:white; }  
</style>  
  
</head>  
<body onload="Init();">  
  
<div id="Navigationsbereich">  
[<a href="javascript:Blaettern(-1)">&lt;&lt;</a>]  
[<a href="javascript:Blaettern(1)">&gt;&gt;</a>]  
</div>  
  
<div id="Bildbereich"></div>  
  
</body>  
</html>

Kann mir jemand weiterhelfen?

Gruß,
pcworld