Optimering af baggrund

Her kan du stille og svare på spørgsmål omkring CSS
Besvar
luggi
Begynder
Indlæg:5
Tilmeldt:18. mar 2012, 16:27
Optimering af baggrund

Indlæg af luggi » 10. jun 2012, 13:19

Hej allesammen her på NemProgrammering

Er der nogen der herinde kunne fortælle mig hvordan man lægger en baggrund ud, så den fylder hele siden bag hjemmesidens faste bredde på de 1024 px. Altså når man åbner er hjemmeside og vil optimere den til fuld størrelse på eksempelvis en iMac 27" eller på et 42" TV.

I kan se hvordan det smukt ser ud på eksempelvis http://www.virgin-atlantic.com/gb/en/index.html eller http://livego.com/

NemProgrammering har lavet den samme funktion på deres side.

Programmerer man det ind eller lægger man et færdigt lavet layout ind på hver enkelt side?

Hilsen Luggi

Brugeravatar
ThomasI
Grundlægger
Grundlægger
Indlæg:1528
Tilmeldt:28. dec 2010, 10:49

Re: Optimering af baggrund

Indlæg af ThomasI » 10. jun 2012, 19:05

Der er mange forskellige muligheder for hvordan du kan gøre det alt efter hvad det præcist er du vil have...

Sådan som det er lavet her på NemProgrammering.dk, så er det blot et aflangt billede som så er blevet stylet med background-repeat ud af x aksen, således at den gentages hele vejen hen over siden lige meget hvor stor siden er.

Men hvis du vil have et faktisk fast billede der bliver større eller mindre alt efter skærm størrelsen så er det noget andet du skal have fat i...

F.eks kunne du gøre det med CSS rent. Er dog i tvivl hvor godt det virker på ældre browsere: se her:
http://css-tricks.com/perfect-full-page ... und-image/


Javascript er også en mulighed, hvor du kan gøre noget ala det her:

Kode: Vælg alt

<SCRIPT LANGUAGE="javascript">
if (screen.width == 1600)	{
	document.write("<body background=\"1600.jpg\">");
}

if (screen.width == 1280)	{
	document.write("<body background=\"1280.jpg\">");
}

if (screen.width == 1152)	{
	document.write("<body background=\"1152.jpg\">");
}

if (screen.width == 1024)	{
	document.write("<body background=\"1024.jpg\">");
}

if (screen.width == 800)	{
	document.write("<body background=\"800.jpg\">");
}

if (screen.width == 640)	{
	document.write("<body background=\"640.jpg\">");
}

if (screen.width <= 639)	{
	document.write("<body background=\"crazily-small.jpg\">");
}
</SCRIPT>


Josefine
Geni
Geni
Indlæg:308
Tilmeldt:9. dec 2011, 16:46

Re: Optimering af baggrund

Indlæg af Josefine » 12. jun 2012, 06:29

Jeg har også bare lavet et enormt baggrundsbillede, der også bliver gentaget, hvis det skulle være nødvendigt (det tror jeg ikke, det bliver, for jeg har lavet den giga stor :lol: ).

Besvar