Martin Effenberg: Preload, wiedermal

N' wunderschoenen Tag allerseits.

Also, ich mache da gerade eine Seite und habe mir diesmal gedacht ich koennte ja die Grafiken der Hauptseite vorladen bevor diese geladen und angezeigt wird, also habe ich folgendes in den Kopf der Datei loading.htm geschrieben:

-------------------------schnipp------------------------------------
<script language="JavaScript">
<!--
function ladebilder()
{
var i = 0;
while ((i<=4))
{
kartetumb = new Image();
kartetumb.src = "./seite/karte/kartetumb.gif";
i++;
mainbild = new Image();
mainbild.src = "./images/main.gif";
i++;
mainfront = new Image();
mainfront.src = "./images/mainfront.gif";
i++;
bayer = new Image();
bayer.src = "./seite/images/bayer.gif";
i++;
}
document.location.href="eunds.htm";
}
-->
</script>
-------------------------schnapp------------------------------------

Das Ganze erschien mir logisch, nur da ich absolut keine Ahnung von Javascript habe funzt das natuerlich nicht so wie ich es will, die Bilder laden zwar ordnungsgemaess vor, nur wird zu eunds.htm verbunden bevor der Browser fertig mit laden ist, auf diese Art und Weise bringt mir das natuerlich nix.

Also muss ich den Browser nur dazu bekommen auf die Bilder zu warten und dann die eunds.htm zu laden ist bestimmt nicht so schwer, nur bin ich von andere Baustelle und hab nix Peilung.

Wie geht das jetzt genau?

mfg
Effe

  1. Hallo Martin,

    document.location.href="eunds.htm";

    Um zu erreichen, daß die Seite erst weitergeleitet wird, wenn die Bilder vollständig geladen sind, benutze <body onLoad = "javascript:document.location.href='eunds.htm'";>, anstatt den Befehl ins obige Script zu schreiben (<../../tebj.htm#a14>).

    Ich würde das Vorladen nicht in eine Funktion einbetten sondern direkt ausführen. Das Einbetten in eine Schleife und das Hochzählen der Varable i ist IMHO auch nicht notwendig.

    MfG
    David

    <img src="http://www.mously.com/banner/170_24.gif" alt="">

    PS: Schreibt man nach der Rechtschreibreform eigntlich "notwändig"?
        Nee, oder... ;-)

    1. Hi David,

      danke, das war genau das wonach ich gesucht habe.
      Funzt jetzt alles.

      mfg
        Effe

  2. Hallo Martin,

    Du scheinst es ja sehr eilig zu haben, nachdem Du mir die selbe
    Problemstellung vor 90 Minuten als Mail rübergegeben hast.

    Ich hatt eh vor, im Forum zu antworten, von daher passt es ja ganz
    gut.

    Natürlich wird document.location.href "zu früh" ausgeführt, weil
    das Script nicht wartet, bis die Bilder geladen sind, sondern eben
    nur den entsprechenden Befehl abarbeitet und dann zum nächsten
    Synatx geht.

    Also entweder fragst Du erst den Ladezustand Deiner Grafiken ab
    und machst location.href davon abhängig (und weil es mehrere sind,
    wirst Du um eine Variable nicht umhin kommen, die hochgezählt wird
    und erst wenn _alle_ Grafiken geladen sind, den location.href aus-
    führt).

    Oder Du machst das, was Du per Mail angefragt hattest:

    Die "eigentliche Seite" in einen <div> packen, und den erst mal ver-
    bergen:

    <div id="seite" visibility=hide style="position:absolut; visibility:hidden;">

    <!--- Hier alle Elemente, einschl. Grafiken --->

    </div>

    und einen zweiten <div> als "bitte warten" definieren:

    <div id="warten" visibility=show style="position:absolut; visibility:visible;">

    <table border=0 cellpadding=0 cellspacing=0 height=100% width=100%>
    <tr>
    <td align="center" valign="center">Bitte warten Sie...</td>
    </tr>
    </table>

    </div>

    In den Header dann folgende JavaScript-Funktion, die Du im <body>
    mit onLoad="zeigen()" anrufst:

    <script language="JavaScript">
    <!---
    function zeigen() {

    if(document.all) {
            document.all.warten.visibility = "hidden";
            document.all.seite.visibility = "visible"; }

    if(document.layers) {
            window.document.layers['warten'].visibility = "hide";
            window.document.layers['seite'].visibility = "show"; }
    }
    //--->
    </script>

    Info: Ich hab diesen Code jetzt nicht getestet, aber aus dem Bauch
    raus müsste es so funzen (evtl. sagt Antje gleich, dass ich Mist
    gepostet habe :-)

    Und was genau bewirkt das ganze jetzt?

    Du lädst Deine Seite vollständig - mit allen Grafiken. Und während
    das passiert, ist der "eigentliche" Seiteninhalt verborgen und der
    User sieht den "Warte"-DIV. _Erst_ wenn die Seite _vollständig_
    geladen ist, wird onLoad() ausgeführt, der Wartetext also aus- und
    der eigentliche Inhalt eingeblendet.

    Wenn Du noch mehr Bilder in's Cache laden willst, also nicht nur
    die, die auf der aktuellen Seite angezeigt werden, dann schreib diese
    in einen ebenfalls verborgenen <DIV>, den Du weiterhin verborgen
    lässt. Auf diese Weise stellst Du aber sicher, dass bereits alles im
    Chache ist, was auf den folgenden Seiten benötigt wird.

    Ansonsten noch drei ganz heisse Tipps:

    1. Stell deine Fragen bitte im Forum; die Lösung könnte auch für
       andere interessant sein.

    2. Steck Deine Nase mal in SELFHTML, das hat noch keinem geschadet :-)

    3. Verlass Dich nie auf das, was FrontPage macht *g*

    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

    1. Hi Alex,
      ja, ich hatte es eilig, meine Cheffe stand hier alle 5 mins und hat gefragt ob ich schon mit der Firmen Page weitergekommen bin.
      Ich habe jetzt allerdings dein Posting erst etwas spaet bemerkt und habe es jetzt so gemacht wie David sagte (s.u.).
      Funktioniert auch ganz gut.

      zu sehen ist das Ganze auf www.e-u-s.de

      trotzdem vielen dank.
        effe