Het gebruik van frames

Maak je eigen Homepage!
Les 4

We zullen nu wat minder belangrijke effecten gaan bespreken. Ze zullen niet allemaal in elke browser werken. Als een bepaalde browser een effect niet begrijpt wordt dit gewoon genegeerd.
Om te beginnen kunnen we de dikte van de kaders regelen.
<FRAMESET COLS="154,*" BORDER=20> <FRAMESET ROWS="170,*"> <FRAME SRC="world.gif" WIDTH=146 HEIGHT=162 SCROLLING=NO MARGINWIDTH=1 MARGINHEIGHT=1> <FRAME SRC="lisa.html"> </FRAMESET> <FRAME SRC="kirsten.html"> </FRAMESET>

We kunnen de kleuren van de kaders aanpassen.
<FRAMESET COLS="154,*" BORDER=20 BORDERCOLOR="#FFOOOO"> <FRAMESET ROWS="170,*"> <FRAME SRC="world.gif" WIDTH=146 HEIGHT=162 SCROLLING=NO MARGINWIDTH=1 MARGINHEIGHT=1> <FRAME SRC="lisa.html"> </FRAMESET> <FRAME SRC="kirsten.html"> </FRAMESET>

We kunnen voor elke afzonderlijke <FRAMESET> de kaders uitschakelen met de optie FRAMEBORDER.
<FRAMESET COLS="154,*" BORDER=20 BORDERCOLOR="#FFOOOO"> <FRAMESET ROWS="170,*" FRAMEBORDER=NO > <FRAME SRC="world.gif" WIDTH=146 HEIGHT=162 SCROLLING=NO MARGINWIDTH=1 MARGINHEIGHT=1> <FRAME SRC="lisa.html"> </FRAMESET> <FRAME SRC="kirsten.html"> </FRAMESET>

We kunnen de lezer ervan weerhouden dat hij/zij de afmetingen van de frames aanpast. Tenzij je hier een goede reden voor hebt zul je deze optie nooit gebruiken.
<FRAMESET COLS="154,*" BORDER=20 BORDERCOLOR="#FFOOOO"> <FRAMESET ROWS="170,*" FRAMEBORDER=NO > <FRAME SRC="world.gif" WIDTH=146 HEIGHT=162 SCROLLING=NO MARGINWIDTH=1 MARGINHEIGHT=1> <FRAME SRC="lisa.html"> </FRAMESET> <FRAME SRC="kirsten.html" NORESIZE> </FRAMESET>

Ok. Nu we iets geleerd hebben over frames gaan we terug naar ons simpele voorbeeldje en gaan we een paar links leggen tussen frames.
<FRAMESET COLS="33%,67%"> <FRAME SRC="alice.html"> <FRAME SRC="kirsten.html"> </FRAMESET>

Wat we gaan doen is een link maken van alice.html naar laura.html. Open dus alice.html met Notepad en voeg het volgende toe...
<HTML> <HEAD> <TITLE>Mijn Frames Pagina</TITLE> </HEAD> <BODY> Alice Breng een bezoekje aan mijn vriendin Laura </BODY> </HTML>

Voeg nu de link toe en sla het document op.
<HTML> <HEAD> <TITLE>Mijn Frames Pagina</TITLE> </HEAD> <BODY> Alice Breng een bezoekje aan mijn vriendin <A HREF="laura.html">Laura</A> </BODY> </HTML>

Probeer maar uit.
<FRAMESET COLS="33%,67%"> <FRAME SRC="alice.html"> <FRAME SRC="kirsten.html"> </FRAMESET>

Als je op de link klikt zul je zien dat Laura's pagina in het venster van Alice wordt geladen. Ik weet het... je zult niet erg onder de indruk zijn. Wat je wilt doen is op een link in het venster van Alice klikken, die dan in het venster van Kirsten geladen wordt. Dat kan, al is het wel iets meer werk.
Je moet eerst met de NAME optie de <FRAME> in je master een naam geven. Dus ga je gang en geef het tweede frame een naam.
<FRAMESET COLS="33%,67%"> <FRAME SRC="alice.html"> <FRAME SRC="kirsten.html" NAME="WINDOW-1"> </FRAMESET>
Laat ik hier even wat bij opmerken. Dat tweede frame is niet echt van Kirsten. Het is gewoon het tweede frame en kirsten.html is het eerste dat er in geladen moet worden. Als we een lege <FRAME> tag hadden dan zou het frame...eh... leeg zijn.
De naam van een frame moet beginnen met een alpha-numeriek teken. Alle andere framenamen worden genegeerd. (Een paar uitzonderingen zijn enkele voorgedefinieerde namen die beginnen met een "underscore" _ . Hier komen we straks op terug.)

Nu moeten we nog een kleinigheidje veranderen in de link in alice.html. Open dus dit bestand nogmaals en voeg een TARGET-optie toe.
<HTML> <HEAD> <TITLE>Mijn Frames Pagina</TITLE> </HEAD> <BODY> Alice Breng een bezoekje aan mijn vriendin <A HREF="laura.html" TARGET="WINDOW-1">Laura</A> </BODY> </HTML>
Deze optie zorgt ervoor dat de link wordt geopend in het venster met de naam WINDOW-1.

Deze manier van linken werkt perfect als je de pagina's van je eigen site bij elkaar wilt linken. Maar wat doe je als je een link wilt leggen naar een pagina van buiten je eigen site? Laten we nog een link aanbrengen in de pagina van Alice.
<HTML> <HEAD> <TITLE>Mijn Frames Pagina</TITLE> </HEAD> <BODY> Alice Breng een bezoekje aan mijn vriendin <A HREF="laura.html" TARGET="WINDOW-1">Laura</A> En natuurlijk moet je ook even naar <A HREF="http://michael1.www.cistron.nl" TARGET="WINDOW-1">Michael</A> </BODY> </HTML>

Zoals je ziet wordt mijn eerste HTML cursus in het venster geladen. (Off-line lezers eerst even inbellen anders zie je natuurlijk niks)

Hoe kun je nu een link op een volledig scherm laten verschijnen? Simpel, verander de TARGET in _top.
<HTML> <HEAD> <TITLE>Mijn Frames Pagina</TITLE> </HEAD> <BODY> Alice Breng een bezoekje aan mijn vriendin <A HREF="laura.html" TARGET="WINDOW-1">Laura</A> En natuurlijk moet je ook even naar <A HREF="http://michael1.www.cistron.nl" TARGET="_top">Michaellt;/A> </BODY> </HTML>

Gebruik altijd deze methode om een link naar een pagina buiten je eigen site de specificeren. Je lezers zullen je dankbaar zijn!
_top is een van de vier zogenaamde 'magic targets'. Het zijn _self, _blank, _parent en _top. Dit zijn de enige targets die met iets anders dan een alpha-numeriek teken kunnen beginnen. Elke target die met een "underscore" _ begint en die niet één van de vier 'magic targets' is wordt genegeerd. Voor wat wij hier doen is eigenlijk alleen _top van belang.
Opmerking - Het is belangrijk dat je TARGET="_top" specificeert en niet TARGET="_TOP". Normaal gesproken is HTML niet hoofdlettergevoelig maar dit is een uitzondering. Het gebruik van _TOP in plaats van _top opent vaak een nieuwe browser in plaats van het volledige scherm in de actieve browser. Nu we het er toch over hebben, dat is wat TARGET="_blank" doet.... de link openen in een nieuw browser venster. TARGET="_self" opent de link in het frame waarin de link staat. Dit heeft dus eigenlijk hetzelfde effect als helemaal niets opgeven. TARGET="_parent" tenslotte opent de link met frames van de vorige <FRAMESET> (bij meerdere frames in elkaar).
Als je en naam opgeeft die niet bestaat wordt een nieuw venster van de browser geopend en wordt de link daarin geopend.

Inleiding Les 1 Les 2 Les 3 Les 4 Les 5 Les 6 Les 7 Index