Avatar billede netro Nybegynder
20. maj 2007 - 16:23 Der er 21 kommentarer og
1 løsning

Div der fylder hele dokumentet

Jeg vil gerne have en div til at lægge som et lag over hele indholdet i viewporten. Når der scrolles skal alt fortsat være dækket. Det hjælper altså ikke bare at sætte dim. til 100%. Har prøvet med offsetWidth/Height, men så mangler jeg stadig at få margin dækket.

Hvordan kan det gøres ( x-browser)?
Avatar billede w13 Novice
20. maj 2007 - 16:26 #1
Hvis der er margins på, kan div'en vel ikke dække dem også. Tror vel enten, du skal sætte margins til 0px eller div'en til position:absolute;.
Avatar billede netro Nybegynder
20. maj 2007 - 16:28 #2
Div'en er absolut positioneret, og den dækker således også for top/left margin, hvis jeg sætter koordinaterne til 0,0 px. Men der er 10-20 px til højre og i bunden den ikke dækker...
Avatar billede w13 Novice
20. maj 2007 - 16:31 #3
måske er dit offset-tal kun til og med margin? prøv lige at sætte margin til 0px på din body.
Alternativt kan du vel bare sige offsetWidth+10 og offsetHeight+10, hvor 10 repræsenterer din marginbredde.
Avatar billede netro Nybegynder
20. maj 2007 - 16:49 #4
Ja, hvis margin er 0, virker det. Men jeg fiskede nok egentlig mere efter, hvordan jeg finder denne margin med javascript, så jeg kan lægge den til offsetWidth/Height.
Avatar billede w13 Novice
20. maj 2007 - 17:21 #5
Her får du i hvert fald begge marginoplysninger at vide:
alert(document.body.currentStyle['margin']);
Avatar billede netro Nybegynder
20. maj 2007 - 17:42 #6
Er der en tilsvarende i FF/NS?
Avatar billede w13 Novice
20. maj 2007 - 17:46 #7
Prøv:
if (document.body.currentStyle) {
    alert(document.body.currentStyle['margin']);
} else if (window.getComputedStyle) {
    alert(window.getComputedStyle(document.body, "").getPropertyValue('margin'));
}
Avatar billede netro Nybegynder
20. maj 2007 - 17:58 #8
Det giver bare en tom alert.
Avatar billede w13 Novice
20. maj 2007 - 18:16 #9
Jaeh, i stedet for margin (under IE-koden) kan du skrive eks. marginBottom, for kun at få det tal, og i FF skal du åbenbart skrive margin-bottom for at den returnerer. FF kan altså ikke vise margin, men godt margin-bottom eller margin-top.
Avatar billede netro Nybegynder
21. maj 2007 - 20:44 #10
Yes, det virker. Dog mangler jeg stadig at få fyldt hele dokumentet ud, da offsetWidth/Height kun giver mig viewportens dimensioner. Hvis der er scroll, er der jo et usynligt areal også.
Avatar billede w13 Novice
21. maj 2007 - 21:18 #11
Så du mangler de sidste 10 i højre side?
Har du et link?
Avatar billede netro Nybegynder
21. maj 2007 - 21:26 #12
Jeg har desværre ikke lige et link, men jeg kan godt forklare det.
Hvis vi siger, at dokumentet er 1000px bredt, viewporten er 500px, og der er 10px margin i begge sider, så fylder div'en kun 500+10+10=520px, hvilket efterlader 480px udækket areal til højre.
Avatar billede w13 Novice
21. maj 2007 - 21:30 #13
definer lige "viewport" for mig så.. jeg troede, du mente dokumentet, når du sagde "viewport".. så teknisk er jeg ikke :)
Avatar billede netro Nybegynder
21. maj 2007 - 21:35 #14
Ok :) Altså simpelthen browserens visningsområde - fra venstre kant til højre kant. Hvis der er vandret scroll, er dokumentet større end viewporten.
Avatar billede w13 Novice
21. maj 2007 - 21:46 #15
Hmmm... Måske scrollWidth og scrollHeight i stedet for det der offset-fætter? :)
Avatar billede w13 Novice
21. maj 2007 - 21:46 #16
Virker i hvert fald i div's.
Avatar billede netro Nybegynder
21. maj 2007 - 22:32 #17
Jah, hvad mon FF/NS vil have i stedet?
Avatar billede w13 Novice
21. maj 2007 - 23:28 #18
Avatar billede netro Nybegynder
22. maj 2007 - 00:00 #19
Rettere sagt, det virker - men ikke efter hensigten. Jeg får kun viewportens bredde og højde (altså samme som med offsetWidth/Height). I IE/Opera fungerer det godt.
Avatar billede netro Nybegynder
31. maj 2007 - 21:11 #20
Det var faktisk meget nemt - bare med css. Dog virker det umiddelbart ikke i IE6-.

position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
Avatar billede w13 Novice
31. maj 2007 - 21:22 #21
Det gør hele tricket i nyeste browsere? Også FF?
Avatar billede netro Nybegynder
01. juni 2007 - 00:19 #22
Ja, både IE7, Opera og FF. Har ikke prøvet på Mac endnu.
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester