|
Multimediakurs Leinfelder: Inhalt/A: Einsteiger/Modul 3 "Frames und iFrames"/Modul 3.1.2 "Frames-Navigation" |
| (© copyright) Letzte Änderungen: |
|
Multimediakurs Leinfelder: Inhalt/A: Einsteiger/Modul 3 "Frames und iFrames"/Modul 3.1.2 "Frames-Navigation" |
| (© copyright) Letzte Änderungen: |
(2. von 4 Seiten) Navigation und Linkerstellung innerhalb von Frames
So, kehren wir zum vorhin als Skizze gezeigten Beispiel zurück. Eine Besonderheit von Frames ist, dass man Verknüpfungen (Links) sehr genau planen muss und dazu den html-Quellcode ergänzen muss.
Stellen Sie sich vor, es sollen zusätzlich zur Seite Anfang auch noch weitere Seiten (kap1.html, kap2.html) in den Hauptframe (rechts unten) geladen werden, nachdem man die Seite Anfang gelesen hat. Also etwa, wie in folgendem Bild gezeigt:
Dazu müssen wir natürlich Links einbauen.
Kein Problem, wenn wir diese am Ende der Seite anfang.html einbauen (oben grau dargestellt). Links, die auf der Seite anfang.html stehen und auf die Seite kap1.html oder kap2.html verweisen, laden nach Anklicken diese Seiten in genau den selben Frame, so wie wir uns das vorstellen.
Problem: Laden einer verlinkten Seite in den falschen Frame:
Wenn Sie aber nun die gleichen Links zu kap1.html bzw. kap2.html auf Ihrer Inhaltsseite (inhalt.html) haben (oben grün dargestellt) und dann auf die Links klicken, werden die Seiten kap1.html bzw. kap2.html - - in das kleine linke Fenster geladen und ersetzen die Inhaltsseite. So war das aber nicht gedacht, die Inhaltsseite sollte ja zu Navigationszwecken stehen bleiben. Was tun?
Lösung:
Nun dies ist sonnenklar. Zusätzlich zu den Linkbefehlen muss noch ein Attribut stehen, welches angibt, in welchen Frame die aufgerufene Seite geladen werden soll, sofern sie nicht in den selben Frame soll. Dazu muss man die Frames aber genau ansprechen können, d.h. die Frames müssen (beliebige, aber eindeutige) Namen bekommen (welche natürlich im html-code definiert sind), siehe Abbildung oben. Damit kann man genau ansteuern, welche html-Dateien in welchen Frame geladen werden sollen.
So geht's:
Unten steht nun nochmals der bereits vorhin gezeigte html-Quellcode der Seite schoenframe.html, nun aber ergänzt um die notwendigen Namensbezeichnungen der definierten Frames (rot), so wie sie schematisch auch im obenstehenden Bild angegeben sind.
| <html> |
| <head> |
<frameset rows=20%,80%> |
<frame name="froben" src="hallo.html"> |
<frameset cols="300,*"> |
<frame name="frmenu" src="frmenu.html"> |
<frame name="frhaupt" src="anfang.html"> |
</frameset> |
</frameset> |
| </head> |
| <body> |
<noframes>schade, Ihr Browser ist doof</noframes> |
| </body> |
| </html> |
Hinzufügen des Target-Attributs zu Links: Ein entsprechender Link von Seite inhalt.html auf Seite kap1.html hat damit folgenden Quellcode (sofern die Seite kap1.html im selben Verzeichnis wie die anderen Seiten liegt)
<a href="kap1.html" target="frhaupt">Kapitel 1</A>
Wir haben hiermit also nun ein neues Attribut für den <a href> tag eingeführt, das sogenannte Ziel (englisch target).
Was machen wir aber nun, wenn wir eine Seite aufrufen wollen, die wieder im gesamten Fenster erscheinen soll? Dies und etliches weiteres zur Navigation, optischen Anpassung und Erstellen von Frames erfahren Sie im dritten und vierten Teil dieser Lektion.
>> Zum dritten Teil des Moduls 3.1: Verlassen von Frames, Anpassung von Frames, Erstellen von Frames mit Composer (3 von 4)