We gaan eerst even terug naar onze simpele framepagina.

<FRAMESET COLS="50%,50%">
  <FRAME SRC="lisa.html">
  <FRAME SRC="kirsten.html">
</FRAMESET>

Als je dat leuk vind kun je plaatjes in een frame zetten. In de map 'examples' staat een bestandje world.gif. Kopieer dit bestandje maar even naar je werkdirectory. On-line lezers kunnen hier klikken en het plaatje van de pagina opslaan.

<FRAMESET COLS="50%,50%">
  <FRAME SRC="world.gif" WIDTH=146 HEIGHT=162>
  <FRAME SRC="kirsten.html">
</FRAMESET>

Vergeet niet dat het altijd verstandig is om de HEIGHT & WIDTH opties bij je plaatjes te specificeren.

We gaan eens proberen of we het plaatje netjes in een venstertje kunnen passen. Om te beginnen verklein je het linker frame tot 146 pixels breed. Omdat we een absolute maat opgeven maken we het andere frame varialbel.

<FRAMESET COLS="146,*">
  <FRAME SRC="world.gif" WIDTH=146 HEIGHT=162>
  <FRAME SRC="kirsten.html">
</FRAMESET>

Vervolgens splitsen we het linker venster in horizontaal in twee delen. Het bovenste deel wordt 162 pixels hoog en het onderste deel neemt de rest voor z'n rekening. In het bovenste deel komt ons plaatje en het onderste deel geven we aan Lisa.

<FRAMESET COLS="146,*">
  <FRAMESET ROWS="162,*">
    <FRAME SRC="world.gif" WIDTH=146 HEIGHT=162>
    <FRAME SRC="lisa.html">
  </FRAMESET>
   <FRAME SRC="kirsten.html">
</FRAMESET>

Zoals je ziet hebben we nu een klein probleempje.

De schuifbalken die je ziet kunnen we specificeren als YES, NO of AUTO. YES betekent dat det venster schuifbalken krijgt, of ze nu nodig zijn of niet. NO betekent dat er geen schuifbalken worden getoond, zelf niet als de inhoud van het venster zo groot is als Amsterdam en Rotterdam bij elkaar. De browser toont zoveel als er in past. AUTO is de standaard waarde. Als de schuifbalken nodig zijn verschijnen ze, anders blijven ze netjes uit de weg. Laten we onze schuifbalken maar eens verwijderen.

<FRAMESET COLS="146,*">
  <FRAMESET ROWS="162,*">
    <FRAME SRC="world.gif" WIDTH=146 HEIGHT=162 SCROLLING=NO>
    <FRAME SRC="lisa.html">
  </FRAMESET>
  <FRAME SRC="kirsten.html">
</FRAMESET>

Ons probleem is nog steeds niet opgelost. Het plaatje staat niet in het frame zoals we dat graag zouden willen. De volgende optie beïnvloedt de marges. De browser geeft automatisch een beetje witruimte rond de inhoud van het venster. Normaal gesproken is dit nodig om esthetische redenen maae het kan ook wel eens slecht uitkomen. Je kunt de grootte van deze marges beïnvloeden met MARGINWIDTH en MARGINHEIGHT. Je bewerkt hiermee respectievelijk de linker- en rechtermarge en de boven- en ondermarge. We gaan ze allebei op 1 zetten. (1 is het minimum)

<FRAMESET COLS="146,*">
  <FRAMESET ROWS="162,*">
    <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 komen in de buurt maar we zijn nog niet waar we zijn willen. De afmetingen van de marges worden van hart tot hart gemeten.
Zo dus:

We hebben een standaardmarge van zes pixels en we hebben de variabele marge die we niet kleiner dan één pixel breed kunnen maken. Dat betekent dus dat de minimale marge aan elke kant vier pixels groot is. Als we nu het frame 8 pixels (vier voor elke kant) groter maken dan het plaatje, zou het moeten passen. Laten we het eens proberen.

<FRAMESET COLS="154,*">
  <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>

Nu wordt het plaatje goed in het frame geplaatst, in ieder geval komt het akelig dicht bij. Heb je ooit een plaatje gezien in een frame dat aan één of meer kanten was afgekapt? Als je absolute maten gebruikt in combinatie met een variabel frame... En als je de framegrootte acht pixels groter maakt dan de afmetingen van het plaatje kan het eigenlijk niet meer mislukken.  *

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