|
De eerste pagina, index.html, wordt verdeeld in frames (zogenaamde framespage of framespagina). De voorbeeldwebsite is zoals je kunt zien verdeeld in twee frames. Links zie je een keuzemenu en in het rechterframe verschijnen de pagina's die worden gekozen in het keuzemenu.
Voor de framespage bestaat een htmlstructuur. Die hoef je alleen te gebruiken in index.html, omdat die framespagina daarna open blijft
staan en andere pagina's in zich oproept. Die structuur ziet er zo uit:
<html>
<head>
<title>framespage I</title>
</head>
<frameset framespacing="1" border="1" frameborder="1" cols="125,*">
<frame name="contents" target="main" src="menu.html" scrolling="auto" noresize>
<frame name="main" src="main.html" scrolling="auto" noresize>
</frameset>
<noframes>
<body>
<p>Sorry, maar je browser ondersteunt geen framespagina's.</p>
</body>
</noframes>
</frameset>
</html>
Bovenstaand stuk HTML geeft je een framespage met twee frames. De pagina wordt verdeeld in twee kolommen. Het linkerframe (contents)
is 125 pixels breed en de rest van het beeldscherm is bestemd voor het tweede frame (main). Bij het contentsframe geven we
aan dat pagina's die daar aangeklikt worden, geopend worden in de mainframe, vandaar "target=main".
Als de pagina index.html wordt opgevraagd, opent hij standaard met de pagina "menu.html" in het contentsframe en "main.html" in het
mainframe. Als de pagina langer is dan past op het beeldscherm is scrollen toegestaan ("auto").
Als bezoekers van je site hun browser zo hebben ingesteld dat deze geen frames weergeeft, verschijnt automatisch de mededeling
"Sorry, maar je browser ondersteunt geen framespagina's" in beeld. Met "border" geef je aan of de scheiding tussen de
frames weergegeven moet worden of niet. Door "noresize" te gebruiken, voorkom je dat bezoekers zelf het formaat van de frames kunnen
wijzigen.
Hier is nog een voorbeeld van een framespage ingedeeld in een titelbalk boven in beeld ("banner") en een mainpage daaronder ("main").
<html>
<head>
<title>framespage II</title>
</head>
<frameset rows="20%,*" framespacing="0" border="0" frameborder="0">
<frame name="banner" scrolling="no" noresize target="main" src="head.html">
<frame name="main" src="main.html" scrolling="auto" noresize>
</frameset>
<noframes>
<body>
<p>Sorry, maar je browser ondersteunt geen framespagina's.</p>
</body>
</noframes>
</frameset>
</html>
Nu is de pagina verdeeld in twee rijen. De hoogte van de titelbalk is ingesteld op 20% van het beeldscherm en de rest is ruimte
voor de mainpage. Deze framespage opent met de pagina "head.html" in het bannerframe en "main.html" in het mainframe.
Uiteraard kun je ook een framespage maken met zowel een menubalk links of rechts in beeld, een titelbalk boven en een mainframe onder in beeld.
<html>
<head>
<title>framespage III</title>
</head>
<frameset rows="20%,80%" framespacing="0" border="0" frameborder="0">
<frame name="banner" scrolling="no" noresize target="contents" src="head.html">
<frameset cols="15%,85%">
<frame name="contents" target="main" src="menu.html" scrolling="auto" noresize>
<frame name="main" src="main.html" scrolling="auto" noresize>
</frameset>
<noframes>
<body>
<p>Sorry, maar je browser ondersteunt geen framespagina's.</p>
</body>
</noframes>
</frameset>
</html>
De pagina bestaat nu uit een titelbalk boven in beeld (banner) voor head.html van 20% hoog, een keuzemenu links in beeld
(contents) voor menu.html van 15% breed en tot slot een mainpage (main) voor main.html van 80% hoog en 85% breed.
| terug | | 
