frameset = frame setting = keret beállítások).10. Keretek
Már a Netscape 2.0 és az Internet Explorer 3.0 böngészõk is ismerik a HTML nyelv egyik leglátványosabb és leghasznosabb eszközét, az oszott képernyõt. Ennek a lényege, hogy a képernyõt feloszthatjuk több részre vízszintesen ill. függõlegesen vagy keverve, és ezen kis részekbe külön-külön újabb HTML oldalakat tölthetünk be.
Ha felosztást szeretnénk végezni, akkor a dokumentumunkban csak annyit kell leírnunk, hogy milyen felosztásról beszélünk, milyen arányban történik a felosztás, milyen oldalak töltõdjenek be az adott részekbe, stb. Ezért a felosztást végzõ HTML dokumentumnak nem lesz "teste" (<body>...</body>) (!) , hiszen ez a dokumentum csak a felosztást végzi, ezen kívûl semmilyen objektum nem szabad szerepeljen a dokumentumban, így nincs értelme a <body> TAG-et belerakni. Most azt gondolnánk, hogy akkor a felosztást a <head> </head> TAG-pár közé kell zárnunk. Ez sem igaz, mert ott csak az oldal tulajdonságaira vonatkozó dolgokról beszélhetünk... Azonban ezt a HTML részt már megadhatjuk <body> helyén, mert nem történik semmi baj. És fontos itt megadni az oldal címét, mert ez fog végig fent lenni a Címsorban, amíg a felosztáson belül dolgozunk, és nem az egyes felosztott részre megnyílt dokumentumok címei. A felosztást tehát a <head> TAG bezárása után, vagyis a </head> parancsszó után történik.
A
felosztást a <frameset> </frameset> TAG
segítségével végezhetjük el. Ennek paramétereként
megadhatjuk, hogy sor vagy oszlopfelsztásról beszélünk,
és hogy hány részre osztódjon a képernyõ,
ill. milyen arányban (
frameset = frame setting = keret beállítások).
Sor- ill. oszlopfelosztás:
Ha soronkénti felosztást szeretnénk, akkor a rows
paramétert használjuk (
rows = sorok). Ennek értéke attól
függ, hogy milyen felosztást várunk eredményül.
Ha azt szeretnénk pl., hogy az ablakunk két részre legyen
felosztva és egyenlõen, akkor így kell írnunk:
rows="50%,50%" . Ha azt szeretnénk, hogy
3 részre legyen felosztva: az elsõ rész foglalja el az
oldal 18%-ét, a második 200 pixelnyit, míg a harmadik a
megmaradt területet - akkor ezt kell írnunk: rows="18%,200,*".
A * tehát a fentmaradó területet jelzi. Miután ezt
beállítottuk részleteznünk kell, hogy hova mit töltsön
be. De ezt már nem a <frameset> TAG paramétereként
kell elhelyeznünk, hanem a <frameset> TAG és
a </frameset> záró-TAG közé
kell beraknunk, mint belsõ TAG. Ez név szerint a <frame>
TAG, amit nem kell bezárnunk (!) (
frame = keret). Ezt a TAG-et annyíszor kell
használnunk, ahány részre felosztottuk az oldalt. Mindig
ennek paramétereként megadjuk hogy az adott részbe melyik
HTML dokumentum töltõdjön be, ill. az adott rész tulajdonságairól
beszélhetünk... Azt, hogy az egyes keretekbe melyik oldal töltõdjön
be, az src paraméterrel adjuk meg (
src = source = forrás). Az oszlopos felosztás
is ugyanígy történik, csak ott nem a rows
paramétert használjuk, hanem a cols -t (
cols = columns = oszlopok).
<html> |
 |
|
| <html> <head> <title> Ez az három részre van felosztva vízszintesen: 18%, 200px és a megmaradt terület</title> </head> <frameset cols="18%,200,*"> <frame src="elso.html"> <frame src="masodik.html"> <frame src="harmadik.html"> </frameset> </html> |
|
Görgõsávok:
Ha több részre osztjuk fel az oldalt, akkor minden egyes rész
mellett megjelenik autómatikusan a görgõsáv
(scrollbar), ha túlhaladjuk vízszintesen
vagy függõlegesen a az ablakban meghatározott területet.
Ha elszeretnénk tüntetni teljesen ezt a görgõsávot,
még abban az esetben is, ha túlhaladta a neki meghatározott
területet, akkor azt az adott rész <frame>
TAG-jében tudjuk beállítani. Itt azt is be tudjuk állítani,
hogy a görgõsáv mindig ott legyen attól függetlenül,
hogy van-e rá szükség vagy nincs. A paraméter neve,
amit erre a funkcióra használunk a scrolling
( scrolling
= görgetés). Értéke lehet YES,
NO vagy AUTO (
YES = igen; NO = nem; AUTO
= automatikus).
| <html> <head> <title> Ez egy három részre felosztott oldal más-más görgõ-tulajdonságokkal</title> </head> <frameset cols="33%,33%,33%"> <frame src="elso.html" scrolling="YES"> <frame src="masodik.html" scrolling="NO"> <frame src="alma.html" scrolling="AUTO"> </frameset> </html> |
|
Méretezés:
Ha így hagyjuk a felosztást, akkor akárki meg tudja változtatni
a egyes részek méretét, az õket összekötõ
keret mozgatásával. Ezt meg tudjuk akadályozni nagyon egyszerûen.
Az adott rész <frame> TAG-jébe, ahol nem
szeretnénk, hogy a mellette levõ keret mozgatható legyen
be kell írnunk egy olyan paramétert, aminek nincs értéke,
a noresize -t (
noresize = could not resizable = nem újraméretezhetõ).
| <html> <head> <title> Három részes felosztott oldal - az elsõt+másodikat összekötõ keret nem mozgatható, de a második igen</title> </head> <frameset cols="33%,33%,33%"> <frame src="elso.html" scrolling="YES" noresize> <frame src="masodik.html" scrolling="NO"> <frame src="harmadik.html" scrolling="AUTO"> </frameset> </html> |
|
Keretszegélyezés:
Idáig láthattuk, hogy az egyes részeket elválasztja
egy vonal. Ezt el is tudjuk tüntetni, vagy állítani tudunk
a vastagságán, esetleg a részek közötti teret
is tudjuk állítani. Általában, ha felosztást
végzünk nem igazán szoktuk berakni az elválasztó
vonalat, fõleg esztétikai okok miatt. Ezeket a paramétereket
a <frameset> TAG-be kell berakni. A frameborder
paraméter arra való, hogy eldöntsük, akarunk szegélyt
vagy nem. Így értéke lehet YES,
vagy NO (
frameborder = keret-szegély). Ha adunk szegélyt,
akkor meg lehet adni a vastagságát a border paraméterrel,
értéke 0->...
lehet (! Ha nem adtunk szegélyt, akkor is a border
értékét 0-ra kell állítani,
mert az egyes böngészõk mégis megjeleníthetik
!). A részek közti távolságot a framespacing
paraméter adja meg, amelynek értékét pixelben állíhatjuk
be.
<html> |
|
|
| <html> <head> <title> Két rész, van szegély, méret 8, keretek közti távolság 20 px</title> </head> <frameset cols="20%,80%" frameborder="YES" border="8" framespacing="20"> <frame src="elso.html"> <frame src="masodik.html"> </frameset> </html> |
|
Keretek (részek) nevei:
Az egyes részeknek fontos, hogy nevet adjunk, mert akkor tudunk az adott
részre hivatkozni bármelyik részbõl is. Az adott
rész nevét a name nevû paraméterrel
adhatjuk meg (
name = név). Erre azért van szükség,
mert pl. ha egy linket készitünk az elsõ részben,
de azt szeretnénk, hogy a második részben jöjjön
elõ a linken hívott oldal, akkor elõször is elnevezzük
a két részt pl. "bal" és "jobb"
- nak, majd az elsõ részen elhelyezett hivatkozás target
nevû paraméter értéke nem a megszokott "_blank",
"_self" stb., hanem a "jobb"
lesz.
| <html> <head> <title> Két rész, az elsõbõl hivatkozunk a második részbe.</title> </head> <frameset cols="30%,70%"> <frame src="bal.html" scrolling="NO" noresize name="bal"> <frame src="jobb.html" scrolling="AUTO" name="jobb"> </frameset> </html> |
|
|
| {bal.html} |
Egymásba épített frame-k:
Az elején még említettem, hogy kombinálni is lehet
ezeket a kereteket. Az egymásbaépítettségrõl
azért beszélek, mert ha pl. azt akarjuk, hogy két oszlopra
legyen osztva a képernyõnk, de még a jobb oldali rész
még két felé vízszintesen, akkor már a második
felosztás egy belsõ felosztás. Nézzük ennek
a megvalósítását, majd aztán a magyarázatát:
| <html> <head> <title> Két rész, a jobb oldali rész még kettõre van osztva vízszintesen</title> </head> <frameset cols="30%,70%"> <frame src="elso.html" scrolling="NO" noresize name="bal"> <frameset rows="35%,65%"> <frame src="masodik.html" noresize name="felso"> <frame src="harmadik.html" noresize name="also"> </frameset> </frameset> </html> |
|
Tehát ez elsõ (külsõ) felosztás két részre osztja az oldalt: a bal oldali részbe az elso.html -t tölti be, és ahelyett, hgy a jobb oldali részbe valamit betöltene, meghív még egy felosztást, amely a jobb oldali területet még két részre osztja vízszintesen, a felsõ részbe a masodik.html -t az alsó részbe a harmadik.html -t tölti be. Persze ez csak egy példa, ezt még sokféleképpen lehet kombinálni.
