Frames

In dit onderdeel komen aan de orde Introductie, Elementen, Opbouw frames, Voorbeelden frames, Frames niet ondersteund, Document openen in frame, Meerdere frames tegelijk vervangen, Frameranden, Frames en JavaScript, Inline frames, Uitlijnen inline frames en Document openen in inline frame.

Introductie

Met behulp van framing kan een venster onderverdeeld worden in meerdere frames of sub-vensters. In elk frame kan een document geopend worden. De frames werken onafhankelijk van elkaar, een document in het ene frame kan vooral een statische weergave hebben (bijvoorbeeld een titelbalk of een inhoudsopgave), terwijl in een ander frame door opeenvolgende documenten heen gelopen wordt. Vanuit elk document kunnen hyperlinks nieuwe documenten openen in hetzelfde of in een ander frame.

Frames worden gemaakt met de elementen FRAMESET en FRAME.
Het FRAMESET element verdeeld een venster in subvensters, in horizontale richting met het COLS attribuut, in verticale richting met het ROWS attribuut. Meestal bevat een FRAMESET element alleen het COLS of alleen het ROWS attribuut, maar het is ook mogelijk beide attributen tegelijk te gebruiken.
Het FRAME element definieert een frame. Met het SRC attribuut wordt bepaald welk document in het frame geopend moet worden. De FRAME elementen worden geplaatst binnen het FRAMESET element. In plaats van een FRAME element kan ook een nieuw (genest) FRAMESET element opgenomen, dat op zijn beurt weer een aantal FRAME elementen bevat.
Aan een frame wordt met het NAME attribuut van het FRAME element een naam gegeven. Door in een hyperlink het TARGET attribuut te gebruiken met de naam van een frame, wordt het betreffende document in het frame met die naam geopend.
Standaard worden de randen tussen de frames in 3-D uitgevoerd. Met het FRAMEBORDER attribuut kan aangegeven worden dat de randen niet in 3-D randen, maar vlak moeten worden weergegeven.
Het NOFRAMES element wordt gebruikt om inhoud op te nemen, welke alleen moet worden weergegeven indien de browser geen frames ondersteunt, of indien het gebruik van frames is uitgeschakeld.

Een bijzondere vorm van frames zijn inline frames (ook wel floating of zwevende frames). Inline frames kun je opnemen in een normaal document. Je moet daarbij denken aan een venster in je document, waar je doorheen kijkt naar een ander document. In het document in dat venster (of eigenlijk frame) kun je net als bij normale frames klikken op een hyperlink, welke vervolgens geopend wordt. Dat openen kan in het frame waarin je geklikt hebt, maar ook in een ander (al dan niet inline) frame.
Een inline frame wordt gemaakt met het IFRAME element.

Elementen

Voor het maken van documenten met (inline) frames zijn de volgende elementen beschikbaar:

De elementen en bijbehorende attributen worden beschreven in aparte documenten. Voor elk element en attribuut is aangegeven of het deel uitmaakt van een HTML-specificatie en zo ja welke. Bovendien is aangegeven en of het element of attribuut ondersteund wordt door en zo ja vanaf welke versie van Netscape Navigator, Microsoft Internet Explorer en Opera.

Opbouw frames

Het gebruiken van frames is niet bijzonder ingewikkeld, mits je maar systematisch te werk gaat.
Als eerste bedenk je op welke wijze je het venster wilt indelen. Daarna gaat het erom stapsgewijs vanuit een leeg venster de gewenste indeling op te bouwen. Je doet dat door in eerste instantie het gehele venster en daarna steeds één frame te vervangen door een frameset met daarin het gewenste aantal nieuwe frames.
We zullen we dat nu doen voor de hieronder afgebeelde indeling. Omdat het vooral om het principe gaat, worden geen waarden opgenomen voor het ROWS of het COLS attribuut van het FRAMESET element. Bovendien wordt het SRC attribuut van het FRAME element vervangen door een aanduiding van elk frame (bijvoorbeeld A1, B11 of B3).

De eerste stap is het verdelen van het gehele venster ofwel verticaal in rijen, ofwel horizontaal in kolommen. In dit geval moet het venster in twee kolommen verdeeld worden. Dat leidt tot de volgende opbouw:

<FRAMESET COLS=" , ">
  <FRAME A>
  <FRAME B>
</FRAMESET>

De tweede stap is het vervangen van FRAME A door een frameset met twee rijen:

<FRAMESET COLS=" , ">
  <FRAMESET ROWS=" , ">
    <FRAME A1>
    <FRAME A2>
  </FRAMESET>
  <FRAME B>
</FRAMESET>

De derde stap is het vervangen van FRAME B door een frameset, nu met drie rijen:

<FRAMESET COLS=" , ">
  <FRAMESET ROWS=" , ">
    <FRAME A1>
    <FRAME A2>
  </FRAMESET>
  <FRAMESET ROWS=" , , ">
    <FRAME B1>
    <FRAME B2>
    <FRAME B3>
  </FRAMESET>
</FRAMESET>

Tenslotte wordt FRAME B1 vervangen door een frameset met twee kolommen.

<FRAMESET COLS=" , ">
  <FRAMESET ROWS=" , ">
    <FRAME A1>
    <FRAME A2>
  </FRAMESET>
  <FRAMESET ROWS=" , , ">
    <FRAMESET COLS=" , ">
      <FRAME B11>
      <FRAME B12>
    </FRAMESET>
    <FRAME B2>
    <FRAME B3>
  </FRAMESET>
</FRAMESET>

Voorbeelden frames

In het volgende voorbeeld wordt het venster horizontaal verdeeld in twee frames:

<HTML>
<HEAD>
<TITLE>Voorbeeld frames</TITLE>
</HEAD>
<FRAMESET ROWS="40%,60%">
  <FRAME SRC="frame1a.htm">
  <FRAME SRC="frame1b.htm">
</FRAMESET>
</HTML>

Indien de browser frames ondersteunt, kun je het resultaat bekijken in een nieuw venster.

In het voorgaande voorbeeld is geen gebruik gemaakt van het NORESIZE attribuut. De rand tussen de frames kan daarom met de muis verplaatst worden. Door in het volgende voorbeeld het NORESIZE attribuut aan het eerste FRAME element toe te voegen, kan dit niet meer:

<HTML>
<HEAD>
<TITLE>Voorbeeld frames</TITLE>
</HEAD>
<FRAMESET ROWS="40%,60%">
  <FRAME SRC="frame2a.htm" NORESIZE>
  <FRAME SRC="frame2b.htm">
</FRAMESET>
</HTML>

Bekijk het resultaat in een nieuw venster.

In het volgende voorbeeld van een document met geneste framesets (een frameset binnen een frameset) zijn de rijen en kolommen op verschillende manieren gedefinieerd:

<HTML>
<HEAD>
<TITLE>Voorbeeld frames</TITLE>
</HEAD>
<FRAMESET ROWS="110,*,55">
  <FRAME SRC="frame3a.htm">
  <FRAMESET COLS="45%,*,125">
    <FRAME SRC="frame3b.htm">
    <FRAME SRC="frame3c.htm">
    <FRAME SRC="frame3d.htm">
  </FRAMESET>
  <FRAME SRC="frame3e.htm">
</FRAMESET>
</HTML>

Indien de browser frames ondersteunt, kun je het resultaat bekijken in een nieuw venster.

In het volgende voorbeeld worden enkele attributen van het FRAME element toegelicht. In het ingesloten frameset zijn dat de attributen MARGINWIDTH en MARGINHEIGHT, waarmee de afstand bepaald kan worden tussen de inhoud van een frame en de linker- en rechterrand, respectievelijk de boven- en onderrand van het frame. In de onderste twee frames gaat het om het SCROLLING attribuut.

<HTML>
<HEAD>
<TITLE>Voorbeeld frames</TITLE>
</HEAD>
<FRAMESET ROWS="50,*,45,45">
<FRAME SRC="frame4a.htm">
<FRAMESET COLS="*,*,*">
<FRAME SRC="frame4b.htm">
<FRAME SRC="frame4c.htm" MARGINWIDTH="2" MARGINHEIGHT="2">
<FRAME SRC="frame4d.htm" MARGINWIDTH="30" MARGINHEIGHT="30">
</FRAMESET>
<FRAME SRC="frame4e.htm">
<FRAME SRC="frame4f.htm" SCROLLING="no">
</FRAMESET>
</HTML>

Bekijk het resultaat in een nieuw venster.

Frames niet ondersteund

Als bovenstaande voorbeelden worden geopend in een browser die geen frames ondersteunt, dan krijgt de gebruiker een leeg venster te zien. Om dat te voorkomen, moet je extra voorzieningen treffen. Bij de ontwikkeling van frames is daarvoor het NOFRAMES element bedacht, dat geplaatst moet worden in één van de framesets. De door het NOFRAMES element ingesloten inhoud wordt niet weergegeven door een browser die frames ondersteunt en is dus alleen in andere browsers zichtbaar.

In het volgende voorbeeld is in het NOFRAMES element een korte boodschap aan de gebruiker opgenomen.

<FRAMESET>
..
<NOFRAMES>
Om deze pagina te kunnen bekijken, moet je over een browser beschikken die frames ondersteunt, bijvoorbeeld: <A HREF="http://home.netscape.com">Netscape Navigator</A> of <A HREF="http://www.microsoft.com/ie">Microsoft Internet Explorer</A>.
</NOFRAMES>
</FRAMESET>

De gebruiker met een browser die geen frames ondersteunt, krijgt alleen hetgeen staat tussen het begin en einde van het NOFRAMES element te zien.

Deze oplossing is niet zo aardig voor de gebruiker, omdat je hem of haar ofwel dwingt een andere browser te gaan gebruiken, ofwel de toegang tot jouw pagina's ontzegt. Daarnaast beperk je op deze manier de verspreiding van je eigen informatie over het net. Het is daarom beter ook te zorgen voor een goede noframes-versie. In het NOFRAMES element neem je dan een verwijzing naar de noframes-versie op.

<HTML>
<HEAD>
<TITLE>Voorbeeld frames</TITLE>
</HEAD>
<FRAMESET COLS="100,*">
<FRAME SRC="frame6a.htm">
<FRAME SRC="frame6b.htm">
<NOFRAMES>
De browser ondersteunt geen frames, bekijk daarom de versie zonder <A HREF="frame6b.htm">frames<A>
</NOFRAMES>
</FRAMESET>
</HTML>

Je kunt het resultaat bekijken in een nieuw venster. In een browser die geen frames ondersteunt, zie je de alleen de inhoud van het rechter frame.

Wanneer je de kleur van de achtergrond, de tekst en de hyperlinks van de inhoud van het NOFRAMES element wilt bepalen, kun je ook het BODY element opnemen.

<FRAMESET>
..
<NOFRAMES>
<BODY ..>
.. inhoud ..
</BODY>
</NOFRAMES>
</FRAMESET>

Document openen in frame

Speciale aandacht verdient het gebruik van hyperlinks in documenten in frames. Standaard wordt een document geopend in het frame waarin de hyperlink staat. Vaak is dat echter niet gewenst en wil je het document juist in een ander frame openen. In andere gevallen wil je het document helemaal niet in een frame openen, maar juist in het volledige venster van de browser.
Het toevoegen van TARGET attribuut aan het element waarmee je de hyperlink maakt (bijvoorbeeld A of AREA) biedt in dit geval uitkomst. Wanneer je als waarde van het TARGET element de naam van een frame opneemt, dan wordt het document in dat frame geopend. De naam van het frame definieer je met behulp van het NAME attribuut van het FRAME element en moet beginnen met een hoofdletter of een kleine letter (A-Z of a-z). Volgens HTML 4.0 is de naam case-insensitive, dat wil zeggen dat geen onderscheid gemaakt wordt tussen hoofd- en kleine letters. In de praktijk maken alle belangrijke browsers dat onderscheid echter wel en moet je er dus voor zorgen dat je zowel in het TARGET attribuut van de hyperlink als in het NAME attribuut exact dezelfde naam gebruikt.

In het volgende voorbeeld is aan elk van de frames een naam gegeven met behulp van het NAME attribuut.

<HTML>
<HEAD>
<TITLE>Voorbeeld frames</TITLE>
</HEAD>
<FRAMESET ROWS="120,*">
<FRAME SRC="frame7a.htm" NAME="inhoudframe">
<FRAME SRC="frame7b.htm" NAME="hoofdframe">
</FRAMESET>
</HTML>

In het documenten in het linker frame zijn de URI's als volgt opgenomen:

<A HREF="frame7c.htm" TARGET="hoofdframe">voorbeeld a</A>

en

<A HREF="frame7d.htm" TARGET="inhoudframe">voorbeeld b</A>

Indien de browser frames ondersteunt, kun je het resultaat bekijken in een nieuw venster.

Naast een zelf bepaalde framenaam kun je in een TARGET attribuut ook gebruik maken van enkele voor-gedefinieerde namen: "_blank", "_parent", "_top" en "_self".

In het volgende voorbeeld wordt gebruik gemaakt van de voor-gedefinieerde framenaam "_blank". Het document wordt daardoor geopend in een nieuw browser-venster. Hetzelfde gebeurt overigens als je gebruik maakt van een niet gedefinieerde framenaam.

<A HREF="frame8c.htm" TARGET="_blank">vensternaam _blank</A>

<A HREF="frame8c.htm" TARGET="zomaar_een_naam">niet gedefinieerde vensternaam</A>

Het resultaat zie je in een nieuw venster.

Als je de voor-gedefinieerde framenaam "_parent" gebruikt wordt een hyperlink geopend in de parent van het huidige frameset. Dat komt er op neer dat het huidige frameset vervangen wordt door het in de link genoemde bestand.

TARGET="_parent"

Bekijk in een nieuw venster hoe het werkt.

Met de voor-gedefinieerde framenaam "_top" wordt een document geopend in het volledige venster van de browser.

TARGET="_top"

Indien je veel hyperlinks in een document hebt, dan kan het handig zijn gebruik te maken van het BASE element met daaraan toegevoegd het TARGET attribuut. Je geeft daarmee aan dat alle URI's in het document geopend moeten worden in een frame met de opgegeven naam. In de URI's zelf hoef je dan geen gebruik meer te maken van het TARGET attribuut. Voor uitzonderingen op de regel gebruik je in de URI wel het TARGET attribuut (het TARGET attribuut in de URI gaat boven het TARGET attribuut in het BASE element). Zie ook de beschrijving bij het onderdeel Hyperlinks.
In het volgende voorbeeld is in de documenten in het bovenste frame het BASE element opgenomen:

<HTML>
<HEAD>
<TITLE>Voorbeeld frames</TITLE>
<BASE TARGET="onder">
</HEAD>
<BODY>
....
</BODY>
</HTML>

In een nieuw venster zie je hoe het werkt.

Wanneer het TARGET attribuut van het BASE element verwijst naar een ander frame en je wilt een document openen in het frame waarin de hyperlink staat, dan kun je als waarde van het TARGET element van bijvoorbeeld het A of AREA gebruik maken van de voor-gedefinieerde framenaam "_self".

Meerdere frames tegelijk vervangen

Soms wil je niet alleen de inhoud van één frame vervangen, maar van meerdere frames tegelijkertijd. Dat kan met HTML indien deze frames samen een frameset vormen, dat je als geheel kunt vervangen. Dat is in het volgende voorbeeld het geval met de frames links 1 en rechts 1. Deze frames kunnen dus in één keer vervangen worden door de frames links 2 en rechts 2.

Bekijk in een nieuw venster hoe het werkt.

Als je van plan bent een compleet frameset te vervangen, moet je daar bij de opzet van je site vanaf het begin rekening mee houden. Normaal zou het document waarin de frames uit het voorbeeld worden gedefinieerd, de volgende opbouw hebben:

<HTML>
<HEAD>
<TITLE> </TITLE>
</HEAD>
<FRAMESET ROWS="90,*">
<FRAME SRC="frameboven.htm" NAME="boven">
<FRAMESET COLS="120,*">
<FRAME SRC="framelinks.htm" NAME="links">
<FRAME SRC="framerechts.htm" NAME="rechts">
</FRAMESET>
</FRAMESET>
</HTML>

Om de onderste twee frames tegelijkertijd te kunnen vervangen, moet het tweede frameset opgenomen worden in een apart document. Het eerste document krijgt de volgende opbouw:

<HTML>
<HEAD>
<TITLE> </TITLE>
</HEAD>
<FRAMESET ROWS="90,*">
<FRAME SRC="frameboven.htm" NAME="boven">
<FRAME SRC="frameonder1.htm" NAME="onder">
</FRAMESET>
</HTML>

In het document frameonder1.htm wordt het frameset gedefinieerd, dat de onderste twee frames bevat:

<HTML>
<HEAD>
<TITLE> </TITLE>
</HEAD>
<FRAMESET COLS="120,*">
<FRAME SRC="framelinks1.htm" NAME="links">
<FRAME SRC="framerechts1.htm" NAME="rechts">
</FRAMESET>
</HTML>

Om de onderste twee frames in één keer te vervangen, kun je nu in willekeurig welk frame een hyperlink opnemen met de volgende opbouw:

<A HREF="frameonder2.htm" TARGET="onder">Vervang de frames</A>

Het document frameonder2.htm heeft dezelfde opbouw als het document frameonder1.htm, alleen verwijst het SRC attribuut van de FRAME elementen naar andere documenten.

In de praktijk zullen de te vervangen frames lang niet altijd niet samen één frameset vormen. Dat is bijvoorbeeld het geval in het volgende voorbeeld:

In HTML heb je dan slechts de mogelijkheid het complete venster te wijzigen en in het te openen document alle frames opnieuw te definiëren. Dus ook het frame wat helemaal niet vervangen hoeft te worden.

Als je vaker meerdere frames tegelijkertijd wilt vervangen, levert de beschreven methode behoorlijk wat werk en extra documenten op. Als alternatief wordt daarom vaak gebruik gemaakt van een oplossing met JavaScript. Daarmee kun je ook eenvoudig frames uit verschillende framesets tegelijk vervangen. Nadeel van het werken met JavaScript is wel, dat het gewenste effect niet bereikt wordt als de bezoeker het gebruik van JavaScript heeft uitgesloten.

Frameranden

Standaard worden frameranden weergegeven in 3-D. De dikte van de randen hangt af van de browser. Wil je werken met niet standaard frameranden, dan moet je er rekening mee houden dat niet elke browser hiervoor dezelfde attributen gebruikt en dat de weergave met hetzelfde attribuut niet in elke browser gelijk is.

Het FRAMEBORDER attribuut van het FRAME element bepaalt of wel of geen framerand weergegeven moet worden. Met de waarde "1" wordt tussen de frames de standaard 3-D rand geplaatst. De waarde "0" zorgt ervoor dat de 3-D rand niet wordt weergegeven, maar omdat de ruimte tussen de frames daarbij niet ook wordt weggelaten, is het resultaat een "vlakke" rand.
De attributen BORDER en FRAMEBORDER maken geen deel uit van HTML 4.0.

De dikte van de frameranden wordt bepaald met het BORDER attribuut van het FRAMESET element. Dit attribuut wordt ondersteund door Netscape Navigator, Opera en Microsoft Internet Explorer 4 en hoger.
Het FRAMESPACING attribuut doet in hoofdlijnen hetzelfde als het BORDER attribuut, maar wordt alleen ondersteund door Internet Explorer 3 en hoger.

Hierna is te zien hoe de verschillende versies van Netscape Navigator, Microsoft Internet Explorer en Opera de frameranden weergegeven: de breedte in pixels en in 3-D of "vlak".
In de eerste tabel is aan elk FRAME element steeds het attribuut FRAMEBORDER="1" toegevoegd, in de tweede tabel FRAMEBORDER="0".
In elke tabel zijn aan het FRAMESET element achtereenvolgens geen attribuut, het BORDER attribuut, het FRAMESPACING attribuut en de combinatie van de attributen BORDER en FRAMESPACING toegevoegd.

In de eerste tabel is te zien dat bij Microsoft Internet Explorer 3 en hoger het FRAMESPACING attribuut en bij Opera 4 en Internet Explorer 5 het BORDER attribuut de 3-D randen 3 pixels dikker weergeeft dan je op grond van de waarde van deze attributen zou verwachten. Dat komt omdat in deze gevallen de waarde toegepast wordt op de ruimte tussen de 3-D randen.
In de tweede tabel is te zien dat Microsoft Internet Explorer 4 een "vlakke" framerand 5 pixels smaller weergeeft, dan opgegeven via het BORDER attribuut. Dit kun je corrigeren, door ook het FRAMESPACING te gebruiken en er in dit geval dezelfde waarde aan te geven als aan het BORDER attribuut.

Omdat Opera met een versienummer lager dan 4 het FRAMEBORDER attribuut niet ondersteunt, wordt de rand altijd in 3-D weergegeven (behalve bij BORDER="0"). Als het BORDER attribuut gebruikt wordt, is de dikte van de rand in deze gevallen het dubbele van de opgegeven waarde.

Door Netscape Navigator 2 worden de attributen BORDER en FRAMESPACING niet ondersteund. De rand wordt daardoor in alle gevallen in 3-D en 5 pixels breed weergegeven.

In het volgende voorbeeld is de weergave te zien van de verschillende mogelijkheden voor 3-D en "vlakke" frameranden. Voor de mogelijkheid, waarbij de frameranden in Netscape Navigator 3 en hoger, Microsoft Internet Explorer 3 en hoger en in Opera 4 "vlak" en 10 pixels breed zijn, is de opbouw als volgt:

<HTML>
<HEAD>
<TITLE>Voorbeeld frames</TITLE>
</HEAD>
<FRAMESET ROWS="25,*,25" BORDER="10" FRAMESPACING="10">
<FRAME FRAMEBORDER="0" SRC="frame11i.htm" SCROLLING="no">
<FRAME FRAMEBORDER="0" SRC="frame11.htm">
<FRAME FRAMEBORDER="0" SRC="frame11i.htm" SCROLLING="no">
</FRAMESET>
</HTML>

Bekijk het voorbeeld in een nieuw venster.

Om in het vorige voorbeeld de frameranden geheel weg te laten vallen, moet je de waarde van het BORDER en het FRAMESPACING attribuut op "0" stellen:

<FRAMESET ROWS="25,*,25" BORDER="0" FRAMESPACING="0">

Bekijk het resultaat in een nieuw venster.

Bij frames waarvan de randen niet meer zichtbaar zijn, kan het soms handig zijn de inhoud van een frame zo dicht mogelijk in de linker bovenhoek te plaatsen. Je doet dat door aan het FRAME element de attributen MARGINWIDTH en het MARGINHEIGHT toe te voegen en beide de waarde "1" te geven.

De 3-D frameranden zijn standaard bij alle browsers grijs. De "vlakke" frameranden hebben bij Netscape Navigator 3 en 4 en bij Microsoft Internet Explorer 3 en 5 standaard de achtergrondkleur van de browser en zijn bij Internet Explorer 4 en Opera 4 grijs.
Wil je enige invloed op de kleur van de frameranden hebben, dan kun je het door Netscape Navigator 3 en hoger en door Microsoft Internet Explorer 4 en hoger ondersteunde BORDERCOLOR attribuut gebruiken. Bij Netscape Navigator 3 en hoger en bij Microsoft Internet Explorer 5 worden alleen de 3-D frameranden in deze kleur weergegeven, bij Internet Explorer 4 ook de "vlakke" frameranden.
Het BORDERCOLOR attribuut maakt geen deel uit van HTML 4.0 en wordt niet door Opera ondersteund.

In het volgende voorbeeld is de weergave te zien van frameranden in kleur, zowel in 3-D als "vlak". Voor de mogelijkheid, waarbij de frameranden in zowel Netscape Navigator 3 en hoger als in Microsoft Internet Explorer 3 en hoger in 3-D zijn en de attributen BORDER en FRAMESPACING de waarde 10 hebben, is de opbouw als volgt:

<HTML>
<HEAD>
<TITLE>Voorbeeld frames</TITLE>
</HEAD>
<FRAMESET ROWS="25,*,25" BORDER="10" FRAMESPACING="10">
<FRAME FRAMEBORDER="1" BORDERCOLOR="red" SRC="frame13i.htm" SCROLLING="no">
<FRAME FRAMEBORDER="1" BORDERCOLOR="red" SRC="frame13.htm">
<FRAME FRAMEBORDER="1" BORDERCOLOR="red" SRC="frame13i.htm" SCROLLING="no">
</FRAMESET>
</HTML>

Bekijk hoe de browser de verschillende frameranden in een nieuw venster weergeeft.

In het vorige voorbeeld is voor alle frames dezelfde kleur voor de frameranden gedefinieerd. Dat had ook voor elk frame een andere kleur mogen zijn. Waar de frames aan elkaar grenzen moet de browser dan bepalen welke kleur gebruikt wordt. Elke browser hanteert daarvoor een eigen methode, die niet alleen afwijkt van de van andere browsers, maar bovendien nogal eens onverwachte resultaten oplevert. Het gebruik van meerdere kleuren voor de frameranden is daarom niet echt aan te bevelen.

Bekijk een voorbeeld in een nieuw venster, waarin voor elk frame een eigen kleur is opgegeven.

In Microsoft Internet Explorer 3 en 4 zijn kunnen niet alleen 3-D frameranden verplaatst worden, ook "vlakke" frameranden. Wanneer je niet wilt dat dit gebeurt, dan moet je het NORESIZE attribuut aan het FRAME element toevoegen:

<FRAME SRC="frame15a.htm" NORESIZE>

Bekijk het effect met Microsoft Internet Explorer in een nieuw venster.

Frames en JavaScript

JavaScript wordt veel gebruikt in combinatie met frames. Mogelijkheden zijn onder meer:

• het updaten van meerdere frames tegelijk met één muisklik
• het updaten van een frame bij openen van een document in een ander frame
• het openen van een document in het volledige venster in plaats van in een frame van iemand anders.

Hoewel JavaScript in principe buiten het bereik van deze handleiding valt, zijn in een apart document enkele voorbeelden opgenomen van de genoemde mogelijkheden.

Inline frames

In het volgende voorbeeld wordt met het IFRAME element een inline frame van 275 pixels breed en 105 pixels hoog gedefinieerd. Met behulp van het SRC attribuut wordt aangegeven welk document in het frame geopend moet worden.

<IFRAME SRC="ifram1a.htm" WIDTH="275" HEIGHT="105">Hier wordt door browsers die het IFRAME element ondersteunen een inline frame weergegeven.</IFRAME>

Het resultaat kun je zien als je een browser gebruikt, die het IFRAME element ondersteunt. Andere browsers herkennen het IFRAME element niet in de body van een document en geven alleen de tekst weer, welke geplaatst is tussen het begin en het eind van het IFRAME element.

Bekijk het voorbeeld in een nieuw venster.

Door het FRAMEBORDER attribuut op te nemen met de waarde "0" kun je de 3-D frameranden weg laten.

<IFRAME SRC="ifram2a.htm" WIDTH="275" HEIGHT="105" FRAMEBORDER="0">Hier wordt ... weergegeven.</IFRAME>

Bekijk het resultaat in een nieuw venster.

Wanneer je het document in het inline frame dezelfde achtergrondkleur geeft als het document waarin het frame geopend wordt, dan lopen beide documenten in elkaar over. Je kunt dit zien in een nieuw venster.

Indien je niet wilt dat de schuifbalk wordt weergegeven, kun je er voor kiezen deze weg te laten. Je gebruikt daarvoor het SCROLLING attribuut met de waarde "no". Je moet er natuurlijk wel voor zorgen dat alles wat je wilt laten zien binnen het frame past.

<IFRAME SRC="ifram4a.htm" WIDTH="275" HEIGHT="105" FRAMEBORDER="0" SCROLLING="no">Hier wordt ... weergegeven.</IFRAME>

Bekijk het resultaat in een nieuw venster.

Met behulp van de attributen MARGINHEIGHT en MARGINWIDTH kun je de afstand van de inhoud van het document in het inline frame tot de rand bepalen.

<IFRAME SRC="ifram5.htm" WIDTH="275" HEIGHT="105" FRAMEBORDER="1" MARGINHEIGHT="15" MARGINWIDTH="30">Hier wordt ... weergegeven.</IFRAME>

Bekijk het resultaat in een nieuw venster.

Wanneer je geen frameranden toepast, wil je de inhoud van het frame misschien zoveel mogelijk in lijn hebben met de inhoud van het document. Je kunt dat doen door de waarde van de attributen MARGINHEIGHT en het MARGINWIDTH zo klein mogelijk te kiezen. Hoewel deze waarde volgens HTML 4.0 minimaal "1" moet zijn, accepteert Microsoft Internet Explorer ook "0". Het resultaat kun je zien in een nieuw venster.

Wanneer je per zijde de afstand tussen de inhoud van het document en de framerand wilt bepalen, kun je aan het BODY element in het document in het inline frame één of meer van de alleen door Microsoft Internet Explorer ondersteunde attributen LEFTMARGIN, TOPMARGIN, RIGHTMARGIN en BOTTOMMARGIN toevoegen:

<BODY BGCOLOR="#FFFFCC" LEFTMARGIN="0" TOPMARGIN="15" RIGHTMARGIN="30" BOTTOMMARGIN="15" ..>

</BODY>

Bekijk het resultaat in een nieuw venster.

In een inline frame kan net als bij gewone frames elk gewenst document geopend worden. Het kan dus een gewoon document zijn met bijvoorbeeld tekst, afbeeldingen en hyperlinks, maar ook een document met gewone frames of weer nieuwe inline frames. In de volgende afbeelding wordt dit gedemonstreerd. Het document in het inline frame bevat 3 frames en het document in het bovenste frame bevat weer een inline frame. Klik op de afbeelding en bekijk de weergave in een nieuw venster.

Uitlijnen inline frames

Voor het uitlijnen van tekst naast een inline frame kun je gebruik maken van het ALIGN attribuut. Wanneer je gebruik maakt van de waarden "top", "middle" of "bottom", wordt de eerste regel op de aangegeven hoogte naast het inline frame geplaatst en komen eventuele volgende regels onder het inline frame te staan.

<P><IFRAME SRC="ifram8a.htm" WIDTH="275" HEIGHT="105" FRAMEBORDER="0" ALIGN="middle">Hier wordt ... weergegeven.</IFRAME> Met het attribuut ... verder.<P>

Bekijk het voorbeeld in een nieuw venster.

Wanneer je het ALIGN attribuut gebruikt met de waarden "left" of "right" wordt het inline frame links of recht in het venster geplaatst en loopt de tekst over de volle hoogte naast het inline frame door. Om er voor te zorgen dat een volgende alinea pas na het inline frame geplaatst wordt, kun je gebruik maken van het CLEAR attribuut in het BR element.

<P><IFRAME SRC="ifram9a.htm" WIDTH="275" HEIGHT="105" FRAMEBORDER="0" ALIGN="right">Hier wordt ... weergegeven.</IFRAME> Met de waarde ... uitgelijnd.<BR CLEAR="all"><P>

Bekijk het voorbeeld in een nieuw venster.

Wanneer je wat afstand wilt houden tussen het inline frame en de aangrenzende tekst, dan kun je gebruik maken van het HSPACE en VSPACE attribuut.

<P><IFRAME SRC="ifram10a.htm" WIDTH="275" HEIGHT="100" FRAMEBORDER="0" ALIGN="left" HSPACE="20">Hier wordt ... weergegeven.</IFRAME> Het HSPACE ... gehouden.<BR CLEAR="all">
<P>

Je ziet het resultaat in een nieuw venster.

Document openen in inline frame

Op vergelijkbare wijze als bij gewone frames, kunnen documenten geopend worden in inline frames. Daarvoor is het nodig dat aan de inline frames een naam gegeven wordt door middel van het NAME attribuut. In de hyperlinks wordt een inline frame, waarin een document geopend moet worden, aangegeven met behulp van het TARGET attribuut van bijvoorbeeld het A of het AREA element. In het volgende voorbeeld worden enkele mogelijkheden gedemonstreerd.

De inline frames in dit voorbeeld zijn als volgt opgebouwd:

<P><IFRAME SRC="ifram11a.htm" WIDTH="265" HEIGHT="120" FRAMEBORDER="0" NAME="links">Hier wordt ... weergegeven.</IFRAME> &nbsp;&nbsp; <IFRAME SRC="ifram11b.htm" WIDTH="265" HEIGHT="120" FRAMEBORDER="0" NAME="rechts"></IFRAME><P>

De opbouw van een URI is bijvoorbeeld:

<A HREF="ifram11d.htm" TARGET="rechts">rechter</A>

Bekijk het voorbeeld in een nieuw venster.

  Inhoud Handleiding HTML   Index   Inhoud Frames

Laatste wijziging 25 juli 2000
Copyright © 1995-2000 Hans de Jong