I denne guide vil jeg vise jer hvordan man laver en iframe og hvordan den skal bruges. 

Måden dette vil fungere på er at jeg vil vise jer sidens indhold og derefter vil jeg fortælle hvad de forskellige ting gør. Jeg vil dog ikke forklare de basis ting i HTML da det anbefales at du kan lidt HTML inden fu læser denne guide.

index.html

Som det første har vi nogle links som linker til 2 forskellige sider nemlig siden vi starter på som er forside.html og så har vi en anden side som vi kalder side2.html det er den linie som ser sådan ud

Som i kan se er der et target som har værdien minIframe. Det vil fortælle din klient at du vil åbne siden i den frame som hedder minIframe som i vores tilfælde er Iframen hvor vi vil vise vores sider i.

Der efter har vi så selve iframen som ser således ud

som vi kan se fra før med linksne er der et felt der har værdien minIframe her er det dog ikke target men name der har den værdi. det fortæller nemlig server og klienten at denne iframe hedder minIframe. udover det kan vi se at den har et felt der hedder src, dette fungere fatisk ligesom hvis man vil indsætte et billeder på en hjemmeside, her henter den dog bare en html side frem i stedet for. Src er også det der fortæller iframen hvilken side den skal vise som standard.

Vi har også et felt der har hedder scrolling som har værdien auto. Dette felt betyder at der vil bliver vist scrollbars automatisk hvis sidens indhold er størrere end iframens størrelse. sidst men ikke mindst har vi feltet frameborder som har værdien 0. Dette fortæller at der ikke skal være nogen ramme rundt omkring iframen. Hvis man ønsker en ramme sættes denne dog til 1.

Nu er vi fatisk færdige, men for at teste kan i jo prøve at lave en forside.html og en side2.html og se om det virker. Jeg vil vise jer koden til min forside.html og side2.html selvom det godt nok kun er meget let html.

forside.html

side2.html

I er velkommen til at skrive en kommentar hvis i har har brug for hjælp eller blot ønsker at kommenter denne guide.

Links

Her kan i se et live eksempel på denne guide.