| Frames By Kevin Yank (kyank@ibm.net) 27 September 1998 |
 |
| Frames By Kevin Yank (kyank@ibm.net) 27 September 1998 |
|
Basic Frames
I denne seksjonen vil vi begynne med å lage et helt grunnleggende sett med vinduer (frameset). Vi skal så modifisere noen av egenskapene for å få dem til å se ut og virke slik vi ønsker. Det overrasker ofte folk hvor enkelt det er å sette opp en frames-basert Webside. Enhver rektangulær seksjon du ønsker å dele browservinduet opp i kalles en frame. For å definere det settet med frames du vil skal vises, trenger du bare å skrive en spesiell HTML fil som definerer størrelsen, posisjonen, og førstegangsinnholdet til hver frame. Deretter må du skrive separate HTML filer som skal bestemme innholdet i hver frame, akkurat på samme måte som du ville gjøre til vanlig når du skriver for hele browservinduet. Ikke bekymre deg om dette ikke sier deg stort så langt... Jeg kommer tilbake til disse sakene i detalj. La oss så langt konsentrere oss om den HTML fila som definerer oppsettet av frames (vinduer). Denne fila kan vi enkelt kalle framesettet (engelsk: frameset), og den kan se ut som følger:
<HTML>
Legg merke til at denne HTML fila ikke inneholder en <BODY> tag. Merk også bruken av tre nye tag's i denne fila:
<FRAMESET> tag'en overtar plassen til <BODY> tag'en i en "vanlig" HTML fil, og brukes til å gi informasjon om det settet med frames som skal fremkomme i browser vinduet. Under denne tag'en blir det bestemt hvordan vinduet skal deles opp, hvor mange frames det skal være, etc. Enhver informasjon vedrørende det settet med frames vi vil ha, spesifiseres altså her. La oss ta et konkret eksempel. Tenk deg at du ønsker å lage en Web side som er delt horisontalt på tvers av midten av browser vinduet. Det vil altså si at du ønsker to frames, som hver skal bruke 50% av den vertikale plassen i vinduet. Det er viktig å tenke seg frames som deler av den totalt tilgjengelige plassen, fordi det er nettopp det som er utgangspunktet for bruken av <FRAMESET> tag'er:
<FRAMESET ROWS="50%,*">
Dette forteller ganske enkelt browseren: Jeg ønsker et frameset som deler opp vinduet i rader. Av den tilgjengelige plassen skal den første frame'n bruke 50%, og den andre skal bruke det som måtte være igjen.. Legg spesielt merke til at asterisken ("*") står for "det som måtte være igjen". mer om dette senere. For å plassere skillet vertikalt (nedover) på siden i steden, ville du bare skrive følgende:
<FRAMESET COLS="50%,*">
Merk deg at HTML tolker "COLS" som "columns". Det betyr at COLUMNS="50%,*" ikke vil fungere! Som du har gjettet <FRAME> tag'en sørger for spesifisert informasjon til hver enkelt frame. Du må legge inn det antallet <FRAME> tag'er som samsvarer med antallet frames du spesifiserte med <FRAMESET> tag'en. I vår svært enkle eksempel vil denne tag'en kun bli brukt til å fortelle browseren hvilken HTML fil den skal laste inn i hver frame:
<FRAME SRC="topframe.html">
Så den første (top) frame i vårt frameset vil lastes opp med topframe.html som 'innmat', mens den andre (bottom) frame vil inneholde botframe.html. Tilslutt følger <NOFRAMES> tag'en <FRAMESET> tag'en, og brukes til å spesifisere det som skal vises til brukere som har browsere som ikke kan håndtere frames. Selv om det har blitt svært uvanlig, finnes det fortsatt mange utdanningsinstitusjoner som tillater studentene adgang til internett på tekstbaserte terminaler. De Web-browserne som brukes i denne sammenheng, f.eks. Lynx, er vanligvis ikke i stand til å vise frames.
<NOFRAMES>
Måten <NOFRAMES> tag'en virker på, er å si til enhver browser som ikke støtter frames: "Ikke vis dette." Siden alle Web browsere som ikke støtter frames vil være uvitende om tag'ene <FRAMESET> og <FRAME>, vil de simpelthen ignorere dem og kun vise teksten i mellom tag'ene. I eksemplet ovenfor har jeg lagt inn en lenke til en versjon av site'n som ikke anvender frames. Selv om det kanskje ikke er helt nødvendig, er det god praksis å inkludere en melding til brukere av browsere som ikke leser frames at site'n din ikke er tilgjengelig. Du kan jo eventuelt legge inn en oppfordring om å laste ned en ny versjon. Slår vi alt dette sammen, så har vi vårt enkle oppsett med to frames. Som nevnt ovenfor, blir <FRAMESET> tag'en brukt til å bestemme informasjon om hvordan vinduet skal deles opp i frames. Dette blir gjort ved bruk av ROWS og COLS attributtene til å definere hvorledes henholdsvis radene og kolonnene skal inndeles. Disse inndelingene kan bestemmes på tre måter: prosentvis, i antall pixtler, og som forholdstall. Disse tre metodene kan enkelt vises ved noen få eksempler. <FRAMESET COLS="50,*,*">
I dette eksemplet vil vinduet bli delt opp i tre kolonner; det første vil bruke en bredde på 50 pixtler. Den andre og tredje framen vil hver bruke halvparten av den gjenværende plassen. <FRAMESET COLS="50%,*,20%">
Dette eksemplet definerer tre kolonner som henholdsvis benytter 50%, 30% og 20% av vinduet. Den første og tredje har den prosentvise dekningsgraden definert, mens den andre bruker de gjenværende 30% av vinduet. <FRAMESET ROWS="3*,1*,2*">
Denne gangen vil vinduet deles opp i rader i stedet for kolonner. Den første framen vil bruke halvparten av vinduet, den andre en seksdel, og den siste vil bruke en tredel av vinduet. Dette kan sikkert virke litt forvirrende umiddelbart, men tenk på det hele som forholdstall. Vinduet er delt opp i 6 like deler (3+1+2=6). Den første framen bruker tre av dem (tre seksdeler er lik en halv), den andre bruker en del (dvs. en seksdel), og den siste framen vil bruke de gjenværende to delene (to seksdeler er lik en tredel). <FRAMESET ROWS="30,50%,2*,1*">
Denne gangen vil det være fire framesrader. Den første framen vil bruke 30 pikstler av høyden på vinduet. Resten fordeles på de gjenværende tre. Den andre framen vil bruke 50% av den totale høyden på browser vinduet. Den tredje og fjerde framen bruker resten av den plassen som er igjen i forholdet 2:1. Dette betyr at den andre av disse to vil bruke dobbelt så mye plass som den andre. Generelt sett anbefales det ikke å blande tre ulike metoder slik det er gjort her. I slike tilfelle anbefaler jeg vanligvis nested (nøstede) framesets for å bedre leselighet og oversiktlighet. Mer om dette senere. Du står fritt til enten å bruke ROWS eller COLS attributter hver for seg, eller sammen, for å bestemme oppsettett:
<FRAMESET ROWS="60,50%,*" COLS="1*,2*,3*">
Dersom du trenger mer fleksibilitet i oppsettet ditt, kan du benytte en teknikk som kalles nested framesets. Som navnet tilsier, innebærer dette at du putter framesett inni framesett. Om du f.eks. ønsker er en 50 pixtel bred menyframe vertikalt på den venstre siden av siden, samtidig som du vil ha en 30 pixtel høy tittel frame på tvers av toppen på siden, kunne du gjøre slik:
<FRAMESET COLS="50,*">
Legg merke til hvordan den 'indre' <FRAMESET> tag'en legges der en <FRAME> tag vanligvis skulle stå. Du oppretter så mange frames du ønsker med 'nested framesets', og du kan til og med definere nye framesett inne i framesett som står inne i framesett, som står inne i framesett, etc.! I tillegg til ROWS og COLS, så er det flere andre attributter til <FRAMESET> tag'en som tillater deg å påvirke utseendet til et framesett:
Eksperimenter med disse mulighetene selv, men pass på at du velger løsninger som er kjørbare for flest mulig browsere slik at folk kan få tilgang til den viktigste delen av site'n din –innholdet. Som du sikkert er klar over nå, så er hovedfunksjonen til <FRAME> tag'en å bestemme oppstartinnholdet for hver frame i framesettet ditt. Liksom <FRAMESET> tag'en, godtar den også flere andre attributter som tillater deg å endre måten de enkelte frame'ene fungerer på. Dersom ikke annet er nevnt, virker disse attributtene fom. Netscape 2, og IE3
|
