Stephan Seitz: Image Preload, kann ich erzwingen, auf den Ladevorgang zu warten?

Hallo allerseits!

Ich dachte, da eine Site von mir extrem viele kleine Images hat, dass ich die vor dem Anzeigen der Seite laden könnte, im nn geht das noch gar nicht richtig (hab ich noch nicht angepasst und kommt später) aber im ie funktioniert das script 100% - bis auf... die image.src werden zwar zugewiesen, aber das html lädt weiter und der effekt, *alle* bildchen zu cachen ist dahin.

Kann ich in js warten, bis der image.src komplett übertragen ist?

Stephan

function preload()
{
// Usage: boolean = preload("image.jpg",......,"#");
// --- Caches a bunch of images, showing a popup Load-bar.

scrwidth = screen.width;  
scrheight = screen.height;  
winwidth = 350;  
winborderwidth = 50;  
winheight = 140;  
scrx=(scrwidth/2)-(winwidth/2);  
scry=(scrheight/2)-(winheight/2);  
opts="screenx="+scrx+",screeny="+scry+",width="+winwidth+",innerwidth="+(winwidth-2)+",innerheight="+(winheight-2)+",height="+winheight+",hotkeys=no,dependent=yes,locationbar=no,menubar=no,resizable=no,status=no,titlebar=no";  
opened = open("","loading",opts);  
if (opened)  
{  
var ok = true;  

var d = opened.document;
        d.open();
        d.writeln('<html><noscript><he'+'ad><title>loading...</title></head></noscript>');
        d.writeln('<body bgcolor="#000000"  text="#FFFFFF" link="#00FF00" vlink="#FFFF00" topmargin="0" leftmargin="0"><center>');
        d.writeln('<p align=center><font color="#ffffff" size="3" face="Verdana"><strong>loading... </strong>');
        d.writeln('</font></p><p><table border="3" cellpadding="0" cellspacing="0" width="90%"><tr>');
        d.writeln('<td valign="center" bgcolor="#ffffff" bordercolor="#c0c0c0" bordercolordark="#808080" bordercolorlight="#ffffff" width='+(winwidth-winborderwidth)+'>');
        d.writeln('<img src="gifs/backgroundtop.gif" align=bottom name=go alt="Please wait." width=1% height=100% border=0>');
        d.writeln('</td></tr></table><p align=center>');
        d.writeln('<img src="gifs/backgroundtop.gif" name=dummy alt="Current load." width=20 height=20 border=1>');
d.writeln('</p><p align=center><font size=1 face="Arial" color="#fafafa">[current image]</font></p></body><html>');
d.close();
if (document.images)
  {
  var imgFiles = preload.arguments;
  if (document.preloadArray==null) document.preloadArray = new Array();
  var i = document.preloadArray.length;
  var anz = imgFiles.length;
  var blcks = (winwidth-(winborderwidth-6));
  var faktor = (blcks/anz);
  var dfaktor=0;
  with (document) for (var j=0; j<imgFiles.length; j++) if (imgFiles[j].charAt(0)!="#")
   {
   preloadArray[i] = new Image;
   preloadArray[i].src = imgFiles[j];
   opened.document.dummy.src = preloadArray[i].src;
   i++;
   if ((faktor*j)>dfaktor)
    {
    dfaktor=(faktor*j);
    opened.document.go.width=dfaktor;
    }
   }
  }
  opened.document.go.width=(faktor*j);
dummy = eyeburner_come();
opened.close();
}
else
{
var ok = false;
}
return ok;
}

  1. Hallo Stephan,

    wenn es Dir darum geht, Deine Seite _erst_ anzeigen zu lassen,
    wenn alle Bilder gecachet sind, dann pack alles in einen <div>,
    den Du verborgen hälst (statt dessen einen anderen <div> anzeigen
    lassen mit "...bitte warten...").

    Mit "onload()" im <body> kannst Du eine Funktion aufrufen, die
    den "Warte"-DIV aus- und den "Inhalts"-DIV einblendet, sobald die
    Seite ganz geladen ist.

    Sollte IMHO funzen.

    Viele Grüsse
       Alex

    <img src="http://home.germany.net/100-80215/alex/images/promo/akonline.gif" alt="">

    http://www.atomic-eggs.com/selfspezial/daten/101.html