Baggrundsbillede uden scroll

Tags:    html css

Hej alle,

Har et spørgsmål vedr. baggrundsbillede på et site. Jeg er igang med en opgave hvor jeg gerne vil have et baggrundsbillede på som fylder hele browser vinduet, men man skal ikke kunne scrolle og teksten skal være centretet uanset hvor stort/lille browser vinduet er. Et eks. på dette: http://studiopainted.dk/. Men hvordan gør jeg dette??

På forhånd tak,
Tommy



Du skal strække et billede og ligge det som baggrund, positioner dit normale indhold ovenpå.

Du kan ikke bruge background-image egenskaben.

/J



Hej alle,

Har et spørgsmål vedr. baggrundsbillede på et site. Jeg er igang med en opgave hvor jeg gerne vil have et baggrundsbillede på som fylder hele browser vinduet, men man skal ikke kunne scrolle og teksten skal være centretet uanset hvor stort/lille browser vinduet er. Et eks. på dette: http://studiopainted.dk/. Men hvordan gør jeg dette??

På forhånd tak,
Tommy


Hej Tommy,

Nu er den side du linker til lavet i Flash, og der kan man lave en hel del ting som man ikke kan i html og css.

Problemet ved at lave det i HTML/CSS er, at du ikke rigtig kan strække billedet, så det har 100% i width og height, hvis du bruger background-image attributen.

Jeg tror ikke det er umuligt, men der skal måske noget JavaScript hen over, hvis du ikke vil lave det hele i flash.

Mine tanker går på noget i stil med at have to div der fylder hele browservinduet, som er sat med position: absolute; og så lave en z-index på dem. Den ene skal så indeholde et billede (din baggrund) som et img tag, med width og height 100% (hvis man kan det) og den anden div kan så indeholde din side.

Er ikke sikker på at det virker og har ikke lige tid at teste, men håber du forstår hvad jeg mener.

M.v.h. Johnny



Hej alle,

Har et spørgsmål vedr. baggrundsbillede på et site. Jeg er igang med en opgave hvor jeg gerne vil have et baggrundsbillede på som fylder hele browser vinduet, men man skal ikke kunne scrolle og teksten skal være centretet uanset hvor stort/lille browser vinduet er. Et eks. på dette: http://studiopainted.dk/. Men hvordan gør jeg dette??

På forhånd tak,
Tommy


Hej Tommy,

Nu er den side du linker til lavet i Flash, og der kan man lave en hel del ting som man ikke kan i html og css.

Problemet ved at lave det i HTML/CSS er, at du ikke rigtig kan strække billedet, så det har 100% i width og height, hvis du bruger background-image attributen.

Jeg tror ikke det er umuligt, men der skal måske noget JavaScript hen over, hvis du ikke vil lave det hele i flash.

Mine tanker går på noget i stil med at have to div der fylder hele browservinduet, som er sat med position: absolute; og så lave en z-index på dem. Den ene skal så indeholde et billede (din baggrund) som et img tag, med width og height 100% (hvis man kan det) og den anden div kan så indeholde din side.

Er ikke sikker på at det virker og har ikke lige tid at teste, men håber du forstår hvad jeg mener.

M.v.h. Johnny
Det var også lidt min tanke, og har også bygget sitet op i denne tanke. Dog virker det ikke, endnu ihvert fald. For jeg tror også det er noget i den stil jeg skal ud i. Hvis jeg får det til at virke vender jeg lige tilbage.. :)



http://webdesign.about.com/od/css3/f/blfaqbgsize.htm

/J
Tak for alle svarene, men fandt selv ud af det. :) Inde under css skrev jeg:

body{
position: fixed;
width: 100%;
height: 100%;
margin: 0;
}

#wall{
background-image: url("grafik/wall.png");
background-position: center;
position: absolute;
width: 100%;
height: 100%;
}

Jeg tilføjede body delen, og nu er det løst.

Men igen, tak for den hurtige hjælp til jer begge.



Det der bør ikke virke :)

Du strækker jo ikke baggrundsbilledet, så det kan umuligt blive 100% høj og bredt.

/J



Du skal have et GIANT billede.

/J



t