Frames

1. Vad är frames?
2. Bra och dåligt med frames
3. FRAME-kommandona
4. Kommandon för layout
5. Kommandon för länkfunktioner
6. Inline frames (IFRAME)
7. Färgade ramar kring frames
8. Uppdatera två frames samtidigt

1. Vad är frames?

Frames kallas ibland för "ramar" eller "fönster" och innebär att man kan dela upp en websida i flera, sins emellan olika fönster. I vart och ett av fönstren laddas sedan ett separat HTML-dokument in.

Vad du gör med FRAMES-kommandona är alltså egentligen inte att göra en webbsida, utan snarare definierar du i ett toppdokument den plats där flera olika websidor skall presenteras.

2. Bra och dåligt med frames

Fördelarna med frames:

De tillåter dig att visa flera olika dokument samtidigt, vilket innebär att när du bläddrar i ett fönster, står de andra stilla. Du kan t.ex ha en innehållsförteckning i en frame och presentera de olika dokumenten i andra frames. Bra om du har mycket information att hålla reda på.

När du väl har laddat ner toppdokumentet och alla frames, går det fort att hoppa mellan de olika dokumenten - mycket fortare än om de skulle laddats var och ett för sig.

Några av nackdelarna med frames:

Den sida där du har dina FRAMES-kommandon (=toppdokumentet) får visserligen en egen adress, men dina frames får det inte, eftersom de inte räknas som självständiga sidor.

Detta gör t.ex att adressen och titeln inte syns på dokumenten i de olika fönstren. När någon sätter ett bokmärke på en av dina frames, blir bokmärkesadressen ändå densamma som toppdokumentets.

Den som vill skriva ut innehållet i en frame ibland bara får med vissa delar av dokumentet och ibland får med även andra frames än den valda.

Man måste vara noga med länkningen så att besökaren inte fastnar i en sida med frames och ha svårt att komma därifrån eller att sidor laddas i fel fönster.

3. FRAME-kommandona

Jag börjar med de enklaste kommandona, som skrivs enligt följande:

<HTML>
<HEAD><TITLE>Mina husdjur</TITLE></HEAD>

<NOFRAMES>
Den här sidan innehåller frames som din webbläsare inte klarade av att visa. <A HREF="sida_a.html">Klicka här för att komma till en sida utan frames!</A>
</NOFRAMES>

</FRAMESET>
</FRAMESET>
</HTML>

Se ett exempel i praktiken!

Förklaring: Först och främst ser du att det inte finns något BODY-element. Det behövs inte eftersom FRAMESET och NOFRAMES ersätter det.

Anger att sidan skall delas upp i två frames. ROWS för rader och COLS för kolumner. Ett FRAMESET-kommando delar alltså upp sidan, antingen horisontellt (ROWS) eller vertikalt (COLS). Värdet innanför citationstecknen anger de olika fönstrens storlekar:

100 för antal pixels
* för resten av sidan
50% för procent av skärmen

Du kan med fördel använda procent och * när du anger värden. Ange bara pixlar när det är absolut nödvändigt att fönstret får exakt storlek, t.ex om du lägger in en bild i en frame. Tillåtna värden är bl.a "*,*,*" som delar upp skärmen i tre lika stora fönster, vilket även "33%,33%,33%" gör (browsern fördelar den sista procenten mellan fönstren).

Två FRAMESET-kommandon delar upp skärmen i tre delar, tre FRAMESET-kommandon ger fyra fönster, osv. Men hur bestämmer jag var uppdelningen skall göras? En browser väljer alltid det övre fönstret före det undre och det vänstra före det högra. I exemplet som du såg laddades ett dokument in i det översta fönstret. Det undre fönstret delades i två delar, där två andra dokument visades. Kommandona

talar alltså om vilket dokument som skall presenteras i ett visst fönster.

Använder jag av artighetsskäl för dem som inte kan läsa frames.

</FRAMESET>

Avslutar FRAMESET-kommandot. Du måste använda lika många avslutningar som startelement, annars fungerar inte presentationen som den skall.

4. Kommandon för layout

scrolling
noresize
marginwidth, marginheight
border

Bestämmer om det skall finnas rullningslister eller inte. Defaultvärdet är auto, d.v.s det läggs in om det finns behov av det. När finns det behov av det? Jo, när det som visas inte får plats i fönstret. Kommandot no tar bort rullningslisterna och yes lägger till dem, oavsett behov. Auto är default eller grundinställning.

Om du valt att visa rullningslister, men inte vill att besökaren skall kunna ändra storleken på dem (genom att dra isär listerna), kan du använda kommandot noresize. Det skrivs också inuti FRAME-elementet.

Tips!
Om man tvingar besökaren att titta på sidan utan att kunna förändra den, om du använder norezize och scrolling=no, måste du vara noga att testa sidan ordentligt innan du lägger upp den. Alltför många slarvar med det. Här hittar du mer information om hur man testar sin sida: Testprotokoll >

Du kan även förändra utseendet på dina frames, men här finns det mängder av specialkommandon för varje browser:

<FRAMESET (...) border=x>< (Netscape)
<FRAMESET (...) frameborder=1/0> (MSIE)
<FRAMESET (...) framespacing=x> (MSIE)

De första två bestämmer om du vill ha kanter på dina frames och hur stora de skall vara (x=antal pixels). Defaultvärdet är som för tabeller. Kommandot framespacing bestämmer mellanrummet mellan två frames; 1 pixel är default.

Bestämmer storleken på marginalerna (x=antal pixels) inne i fönstret: height för övre och undre delen och width för vänstra och högra delen.

5. Kommandon för länkfunktioner

name
target

Det finns två sätt att använda länkar i frames:

Metod 1

Du klickar på en länk i ett fönster och ett nytt dokument laddas in i samma fönster. Detta är default dvs grundinställningen. För att skapa den gör du bara en länk till ett annat dokument, som vanligt.

Metod 2

Du klickar på en länk i ett fönster och ett nytt dokument laddas in i ett annat fönster. Du måste använda "name" och "target" för att åstadkomma detta:

Här heter det vänstra fönstret A och det högra B. Om du nu vill ha en länk i A till ett dokument som skall laddas in i B, måste du i a.html skriva:

Det här fungerar eftersom du i toppdokumentet just knutit ihop dokumentet med ett namn.

Om du klickar här kan du se hur det blir!

Mer om "target"

target="_top"

Detta kommando använder du om du vill att en sida skall visas i ett nytt fönster som lägger sig över de andra tre.

target="_self"

Används om du vill att en ny sida skall visas i ett av de tre fönstren. Det betyder alltså att du i en frame kan länka till en annan sida och genom att använda target="_self" uppdateras bara den frame där länken befinner sig.

target="_parent"

"Parent" syftar på "föräldern" till den frame du befinner dig i och gör alltså att browsern söker upp toppdokumentet. Det här kommandot används mycket av dem som lägger in frames i frames och alltså har flera olika toppdokument.

target="_blank"

Öppnar länkar i ett nytt, separat fönster.

target="_top"...

Öppnar länkar i ett och samma fönster.

Tips!
Om du i ett dokument har väldigt många länkar och inte vill använda kommandot target="_top" för varje länk så skriver du istället:

6. Inline frames (IFRAME)

Det här kommandot används för att skapa "inline frames", dvs en frame som ligger inuti en annan sida. Här ser du ett exempel:

som ger följande resultat:

Du kan manipulera fönstret som för vanliga frames, men följande kommandon tillkommer:

Fungerar precis som när du lägger in bilder. Du anger storleken på varje fönster i pixels. Du anger hur fönstret skall placeras med align och valign.

7. Färgade ramar kring frames

Detta fungerar väldigt dåligt i webbläsarna. Använd attributet bordercolor="x", där x står för en färgkod, som vanligt.

8. Uppdatera två frames samtidigt

Om du vill veta mer om detta skall du läsa mer på mina sidor om JavaScript. Gå dit >

Tack till Jennie Eriksson och Kalle Poromaa för alla kommentarer till denna sida!