OFFLINE

HTMLinfo => Alapfokú weblecke => Keretek (2)

Beállítási lehetőségek

Mostantól, hogy egyszerűbb, könnyebben átlátható legyen, elhagyom a HTML deklarációkat, csak a <FRAMESET> elemen belül történtekkel foglalkozunk.

Álljunk neki meghatározni, hogyan is nézzenek ki frame-jeink. Mondjuk meg böngészőnknek, hogy ossza fel ablakát két oszlopra; foglalja el mindkettő az ablak 50-50% -át!

<FRAMESET COLS="50%,50%" >
</FRAMESET>

Ettől még nem sok minden fog történni, de kiindulásnak jó lesz :)
Főleg, ha azt is megmondjuk a böngészőnek, hogy mi is legyen az egyes keretekben:

<FRAMESET COLS="50%,50%">
<FRAME SRC="egyik.html">
<FRAME SRC="masik.html">
</FRAMESET>

Próbáljuk ki! És tekintsünk büszkén első teljes értékű FRAME-es lapunkra!

Még egy dolog, mielőtt továbbmegyünk: A <FRAMESET> html elemet container, magyarul befogadó elemnek (tag) nevezzük, mert más elemet, jelesül a <FRAME> elemet tartalmaz. A befogadó elemeket onnan ismerhetjük fel, hogy van kezdo <tag> és záró </tag> deklarációja.
A <FRAMESET> elem végzi el az ablak felosztását..., és semmi mást. Meghatározza hogyan legyen a böngészőablak felosztva: miképpen legyenek a frame -ek elhelyezve.

Feloszthatjuk-e kettőnél több részre a böngészőablakot? Miért ne? Csak minden egyes frame-hez hozzá kell rendelni egy-egy önálló HTML oldalt.

<FRAMESET COLS=" 20%,20%,20%,20%,20%">
<FRAME SRC="egyik.html">
<FRAME SRC="masik.html">
<FRAME SRC="harmadik.html">
<FRAME SRC="negyedik.html">
<FRAME SRC="satobbi.html">
</FRAMESET>

Nézzük meg, milyen lett!

A FRAME-eknek nem kötelező egyforma széleseknek lenniük, de oda kell figyelni, hogy a százalékösszeg -ha egy mód van rá- 100% legyen :)

Egy böngészőablakot nem csak függőlegesen oszthatunk fel. Ha vízszintesen szeretnénk ezt megtenni, a FRAMESET elem attribútumai a következőképpen nézhetnek ki:

<FRAMESET ROWS="10%,20%,30%,15%,25%">
<FRAME SRC="egyik.html">
<FRAME SRC="masik.html">
<FRAME SRC="harmadik.html">
<FRAME SRC="negyedik.html">
<FRAME SRC="satobbi.html">
</FRAMESET>

Így kell kinéznie.

Térjünk vissza az első próbálkozásunkhoz, osszuk két egyforma részre az ablakot, függolegesen.

<FRAMESET COLS="50%,50%">
<FRAME SRC="egyik.html">
<FRAME SRC="masik.html">
</FRAMESET>

Írjuk át egy kissé a kódot, az első 50% helyett álljon magában az 50, a másodikat cseréljük le egy * -ra.

<FRAMESET COLS="50,*">
<FRAME SRC="egyik.html">
<FRAME SRC="masik.html">
</FRAMESET>

Ebben az esetben az első helyen álló szám a FRAME szélességét pixelben (képernyőpont) adja meg, a * pedig a teljes fennmaradó részt jelenti.

Itt kell tennünk egy kis kitérőt, néhány fontos megjegyzés erejéig: Ha készítünk egy háromkeretes oldalt, amelyiknek a bal és jobb kerete 100-100 pixel széles, (<frameset cols="100,*,100">)akkor 800x600 -as képernyőfelbontás esetén a középső frame 600 pixel széles lesz. Marha jól fog kinézni. Otthon, amíg tervezzük (design). Bárkinek megmutatjuk, megdícsér. El is szállunk magunktól, feltöltjük a szerverre: aztán megnézi valaki 640x480 -as felbontással. A középső frame most már csak 440 pixel. Amit oda terveztünk, szétesik, elcsúszik.

Ez az oka a legtöbb frame-mel készített oldal hibájának. A legnépszerűbb frame-kiosztás szerint látható baloldalt egy keskeny navigációs sáv, jobbra pedig egy nagyobb méretű főablak. Ezt is könnyu elszúrni, ha a frame -ek méretét relatívan (%-ban) adjuk meg (pl.: <FRAMESET COLS="15%,85%">). Otthon valószínűleg minden jól fog kinézni, de... más képernyőfelbontással a navigációs sáv esetleg túl keskeny lesz; az ott található linkek több sorba kerülnek, legrosszabb esetben gombnak használt képeink miatt megjelenik egy vízszintes görgetősáv! Oda a design!

A megoldás az lesz, hogy figyelembe vesszük, minek is a %-a az a bizonyos %. Az előző példában említett 15% a vízszintes képernyőfelbontás 15%-a! Ez azt jelenti, hogy a bal oldali frame minden felbontásnál más szélességben fog megjelenni! Mit tehetnénk? A megoldás most sem bonyolult: legyen a bal frame szélessége abszolút módon meghatározva, a jobb frame pedig maradjon relatív (rugalmas: <FRAMESET COLS="120,*">).

előző  tetejére  következő