HTML Frejmovi - Lekcija 3

Vratimo se na nešto malo jednostavnije.

<FRAMESET COLS="50%,50%">
  <FRAME SRC="ivana.html">
  <FRAME SRC="dragana.html">
</FRAMESET>

VIDI!


Možemo da ubacimo i slike u frejmove. Snimite ovu sliku u Vaš radni folder kao WORLD.GIF. (Kako? Kliknite desnim tasterom, pa izaberite Save Image As/Save Picture As)

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

VIDI!
Ne zaboravite da je dobro uvek dodati atribute HEIGHT i WIDTH, za bilo koju sliku (to pomaže browseru da brže učita sliku).


Hajde da frejmujemo ovu sliku u potpunosti. Prvo ćemo podesiti levi frejm tako da bude širok 146 piksela (toliko je široka i ova slika). Pošto korisrimo apsolutne jedinice, valjalo bi da drugi frejm definišemo kao elastičan, pomoću *.

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

VIDI!


Sledeća stvar je da levi frejm podelimo horizontalno na dva dela. Gornji deo će biti visok 162 piksela (Kako "Zašto"? Pa, slika je visoka toliko!), a donji - ono što preostane. Gore ćemo staviti sliku, a dole Ivanu.

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

VIDI!
Kao što vidite, imamo problem.


Skrolbarovi (trake za pomeranje sadržaja polja) mogu biti definisani kao YES, NO ili AUTO. YES znači da će prozor imati skrolbar, bez obzira na to da li je on zaista potreban. NO znači da skrolbar neće postojati, bez obzira na veličinu sadržaja Vašeg frejma - jednostavno, browser će prikazati samo onoliko koliko je moguće. AUTO je default vrednost. Ukoliko je skrolbar potreban, pojaviće se; u suprotnom - neće. Dobro... hajde da uklonimo skrolbarove.

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

VIDI!

Budite veoma obazrivi sa uklanjanjem skrolbarova, a sve u vezi sa različitim rezolucijama. Ono što bez skrolbarova izgleda dobro pri Vašoj rezoluciji, na nekoj drugoj rezoluciji neće biti potpuno vidljivo. Zbog toga važi sledeći predlog: atribut SCROLLING koristite samo kad je to neophodno.


OK. Vratimo se na frejmovanje. Problem postoji i dalje. Slika ne stoji u frejmu baš dobro. Zato ćemo upoznati sledeća dve atributa, zadužene za margine. Verovatno ste primetili da browser uvek ostavi malo slobodnog prostora oko sadržaja svakog frejma. Ova pojava postoji zbog estetike. Međutim, i veličina margina se može kontrolisati pomoću atributa MARGINWIDTH i MARGINHEIGHT. Oni kontrolišu levu i desnu, odn. gornju i donju marginu, respektivno. Hajde da ih podesimo na 1 (što je minimalna vrednost za Netscape).

<FRAMESET COLS="146,*">
  <FRAMESET ROWS="162,*">
    <FRAME SRC="world.gif" WIDTH=146 HEIGHT=162 SCROLLING=NO
     MARGINWIDTH=1 MARGINHEIGHT=1>
    <FRAME SRC="ivana.html">
  </FRAMESET>
  <FRAME SRC="dragana.html">
</FRAMESET>

VIDI!


Na žalost, ni ovo još uvek nije dovoljno. Dimenzije frejmova se obično mere od centra do centra.

Uvek postoji barem minimalna ivica, debljine 1. Kako je default ivica široka oko 6 piksela, to znači da moramo da dodamo 8 na svaku dimenziju slike (6+2×1). Ako Vas sve ovo zbunjuje, jednostavno dodajte 8 na dimenzije slike, da bi ste dobili frejm pravih dimenzija.

<FRAMESET COLS="154,*">
  <FRAMESET ROWS="170,*">
    <FRAME SRC="world.gif" WIDTH=146 HEIGHT=162 SCROLLING=NO
     MARGINWIDTH=1 MARGINHEIGHT=1>
    <FRAME SRC="ivana.html">
  </FRAMESET>
  <FRAME SRC="dragana.html">
</FRAMESET>

VIDI!
Ovako će slika biti prikazana savršeno unutar prozora (ili bar gotovo savršeno). Da li ste ikada videli sliku u frejmu, koja je isečena sa jedne ili više strana?   *

<--Lekcija 2        Lekcija 4-->

Sadržaj Lekcije
Uvod - 1 - 2 - 3 - 4 - 5 - 6 - 7
Templates "Barebones"
HTML vodič
Z o N i . W e b !