beispiel, download, frames, Ladereihenfolge, vorlader, CSS, Style Sheets, free, kostenlos
 Ladereihenfolge
    
 HomeFrames • Ladereihenfolge  DOWNLOAD  BEISPIEL 

 Ladereihenfolge festlegen

Für einen Frameset wollen sie festlegen, das zunächst der Frame 'links' mit Inhalt (HTML-Datei) gefüllt wird. Rechts wird eine Leerdatei angezeigt. Erst später soll mit dem Laden der endgültigen Datei für den Frame 'rechts' begonnen werden.

bevorzugte Ladereihenfolge - verzögertes Nachladen

UPDATE  23.08.2010  Delay-Script nachgetragen - Verzögerung 3 Sek.


Das würden sie immer dann so wollen, wenn mehrere Frames sehr große Dateien (in kB) beinhalten, die sie dem Besucher aber (aus welchen Gründen auch immer) in einer bestimmten Rangfolge anzeigen möchten (Ladezeit?). Sie bevorzugen beim Laden der Dateien einen Inhalt, der zuerst angezeigt werden soll.

'So hat ihr Seitenbesucher schon mal etwas zum anschauen' und sie lenken das Augenmerk gezielt auf die Seite im linken Frame. Rechts könnte man 'wird geladen' anzeigen.

Eine echte Ladereihenfolge wird hier eigentlich nicht festgelegt. Für einen der Frames wird lediglich ein verzögerter Nachladevorgang eingeleitet. Die Verzögerungszeit ist hier 3000 Millisekunden.

Anwendung findet dieses Beispiel z.B. wenn eine der HTML-Dateien im Frameset ein Video oder eine Soundfile beinhaltet, welche den Ladevorgang sämtlicher Dateien verzögert.



   Der Frameset als Ausgangsbasis

Für den erstrangigen (linken) Frame, wird bei der Notierung des Framesets der Dateiname der 'wichtigen' Datei eingetragen.

Für den zweitrangigen (rechten) Frame, wird bei der Notierung des Framesets der Dateiname einer 'Blinddatei' eingetragen. Diese Datei hat nur wenige kB und wird erst später gegen die endgültige Datei ausgetauscht.

<frameset rows="100,*">
<frame name="oben" src="menue.htm">

<frameset cols="50%,50%">
<frame name="links" src="seite1.htm">
<frame name="rechts" src="blank.htm">
</frameset>

</frameset>
Abbildung: Hier wird zuerst im Frame 'links' die Bild-Vorschau, im Frame 'rechts' eine Fülldatei geladen (so steht es in der Notierung des Framesets). Durch eine Erweiterung in der Frameset-Notierung wird der eigentliche Inhalt für den Frame 'rechts' später nachgeladen.




In diesem Beispiel mit 3 Frames werden 5 HTML-Dateien benötigt:
  1. die Framesetdatei
  2. menue.htm   - Datei für das Menü
  3. seite1.htm   - Datei für Frame 1
  4. blank.htm    - temporär für Frame 2
  5. seite2.htm   - spätere Datei für Frame 2



   Quellcode für die Frameset-Datei

Die Framesetdatei enthält neben der Notierung der HTML-Anweisungen für den Frameset zusätzlich das JavaScript mit den Funktionen 'refreshFrame()' und 'NachLaden()'. Die Funktion 'refreshFrame()' ruft zeitverzögert die Funktion 'NachLaden()' auf.

In diesem Frameset-Beispiel werden 3 Frames definiert: oben, links, rechts. Im Frameset-Tag ist der Funktionsaufruf eingetragen. Der Funktionsaufruf für 'refreshFrame()' wird mit onLoad eingeleitet, also bereits zu dem Zeitpunkt, wo der Inhalt des Frames geladen wird. Etwa zu diesem Zeitpunkt beginnt dann auch der Zählvorgang für die Verzögerung.


Sie bestimmen den Frame, der später mit der endgültigen Seite gefüllt werden soll. Framename und Dateiname für die später zu ladende Datei werden in der Funktion 'NachLaden()' eingetragen.

Die Funktion 'NachLaden()' wird zur Zeit mit einer Verzögerung vom 3000 Millisekunden aufgerufen. Den Zeitwert können Sie anpassen.

Das Script zum zeitverzögerten Nachladen steht im Head-Bereich der Frameset-Datei!


Frameset-Datei:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
<html>
<head>

<script type="text/javascript" language="JavaScript">
<!-- Begin

function refreshFrame() {
// 3000 Millisekunden Verzögerung
setTimeout('NachLaden()',3000);
}


function NachLaden() {
// Seite die später geladen wird ist 'abc.htm'
// Framename ist 'rechts'
frames['rechts'].window.location.href = "abc.htm";
}

//  End -->
</script>

</head>


<frameset rows="100,*">
<frame name="oben" src="menue.htm">

<frameset cols="50%,50%" onLoad="refreshFrame();">
<frame name="links" src="seite1.htm">
<frame name="rechts" src="blank.htm">
</frameset>

</frameset>

</html>



Die Seite 'blank.htm' wird temporär in den Frame 'rechts' geladen, der später mit der eigentlichen Seite gefüllt werden soll






NACH OBEN