Handleiding HTML Inhoud HTML | Inhoud CSS | Trefwoordenregister | Begin

Inhoud onderdeel: Introductie frames | Opbouw frames | Voorbeelden frames | Browser ondersteunt geen frames | Document openen in frame | Meerdere frames tegelijk vervangen | Frameranden | Inline frames | Uitlijnen inline frame | Document openen in inline frame | Transparante inline frames

Gerelateerde elementen: FRAME | FRAMESET | IFRAME | NOFRAMES

Inline frames

Een inline frame is een frame dat is opgenomen binnen een document dat wordt weergegeven in een venster of in een ander frame. Je kunt het beschouwen als een opening in het document, waar doorheen je een ander document ziet. Inline frames worden ondersteund door Microsoft Internet Explorer 3.0 en hoger, Netscape Navigator 6.0 en hoger, Mozilla, Firefox en Opera 4.0 en hoger.

Een inline frame definieer je met het IFRAME element. In het volgende voorbeeld is met de attributen WIDTH en HEIGHT vastgelegd dat het inline frame 285 pixels breed en 100 pixels hoog moet zijn. Met behulp van het SRC attribuut wordt aangegeven welk document in het frame geopend moet worden.

<IFRAME SRC="iframes-vb.html" WIDTH="285" HEIGHT="100"> </IFRAME>

Als alternatief voor browsers die inline frames niet ondersteunen, kun je tussen de activering en de beëindiging van het IFRAME element tekst of andere inhoud plaatsen. Je kunt die mogelijkheid bijvoorbeeld gebruiken om het document uit het inline frame te openen in een nieuw venster.

<IFRAME SRC="iframes-vb.html" WIDTH="285" HEIGHT="100">De browser ondersteunt geen inline frames. Bekijk de <A HREF="iframes-vb.html" TARGET="_blank">inhoud</A> in een nieuw venster.</IFRAME>

Het resultaat kun je hierna zien als je een browser gebruikt, die het IFRAME element ondersteunt. Andere browsers herkennen het IFRAME element niet en geven alleen de tekst weer, welke geplaatst is tussen de activering en de beëindiging van het IFRAME element.

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

<IFRAME SRC="iframes-vb.html" WIDTH="285" HEIGHT="100" FRAMEBORDER="0"> </IFRAME>

Normaal gesproken zal de browser een verticale en/of een horizontale schuifbalk weergegeven, wanneer de afmetingen van het inline frame te klein zijn om de inhoud van het document (inclusief de marges) geheel weer te geven. In de voorgaande voorbeelden is daarom een verticale schuifbalk te zien. Indien je niet wilt dat schuifbalken worden weergegeven, kun je er voor kiezen deze weg te laten. Je gebruikt daarvoor het SCROLLING attribuut met de waarde "no". Je moet er wel rekening mee houden dat een deel van de inhoud dan misschien niet meer zichtbaar is.

<IFRAME SRC="iframes-vb.html" WIDTH="285" HEIGHT="100" FRAMEBORDER="0" SCROLLING="no"> </IFRAME>

Ook wanneer het inline frame voldoende groot is om de complete inhoud van het document erin te laten zien, geeft Microsoft Internet Explorer 6 soms zowel een verticale als een horizontale schuifbalk weer. Dat is het geval als het document in het inline frame een DOCTYPE-declaratie heeft, die ervoor zorgt dat de browser het in de zogenaamde standards modus weergeeft. Je kunt dit probleem oplossen door het document in het inline frame een andere DOCTYPE-declaratie te geven. Bijvoorbeeld die van HTML 4.01 Transitional zonder URI.

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.

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="iframes-vb.html" WIDTH="285" HEIGHT="100" FRAMEBORDER="1" MARGINHEIGHT="15" MARGINWIDTH="30"> </IFRAME>

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, accepteren de verschillende browsers ook "0".

<IFRAME SRC="iframes-vb.html" WIDTH="285" HEIGHT="100" FRAMEBORDER="0" MARGINHEIGHT="0" MARGINWIDTH="0"> </IFRAME>

Om het effect goed te laten zien, is in het voorbeeld een afwijkende achtergrondkleur gebruikt. In de praktijk ligt het echter meer voor de hand de marges juist zo klein mogelijk te maken, als de achtergrondkleuren van het document en het inline frame gelijk zijn.

In Netscape Navigator 6.0 en hoger, Mozilla en Firefox wordt de inhoud alleen in de linker bovenhoek geplaatst als het document een DOCTYPE-declaratie heeft, die ervoor zorgt dat de browser het in de zogenaamde quirks modus weergeeft. In de standards modus wordt het document alleen direct tegen de linkerrand van het inline frame geplaatst. Je kunt dit oplossen door voor het eerste element op blokniveau in het document de margin-top eigenschap op te nemen met de waarde "0" (zie ook het onderdeel Basisweergave document).

Wanneer je een andere rand om het inline frame wil dan de standaard 3-D rand, dan moet je gebruik maken van stylesheets. In het volgende voorbeeld is met behulp van het STYLE attribuut een inline stijl vastgelegd voor het IFRAME element. Met de border eigenschap is bepaald dat een blauwe vlakke rand van 1 pixel breed om het inline frame geplaatst moet worden.

<IFRAME SRC="iframes-vb.html" WIDTH="285" HEIGHT="100" FRAMEBORDER="0" STYLE="border: 1px solid #336699;"> </IFRAME>

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. Je kunt de weergave door de browser in een nieuw venster bekijken.

Vervolg: Uitlijnen inline frame

Inhoud onderdeel | Inhoud HTML | Inhoud CSS | Trefwoordenregister | Begin

Handleiding HTML (https://www.handleidinghtml.nl/)
Copyright © 1995-2024 Hans de Jong
Laatste wijziging: 8 april 2006