Notifikationer

Markér alle som læst Log ud

lklingenberg Nybegynder

22. september 2003 - 10:36 Der er 11 kommentarer og
1 løsning

Udregning af et doluments højde

Hi,

Kan man via javascript beregne et dokuments højde hos klienten - dvs. højden af hele dokumentet og således ikke kun skærmbilledets højde?

Jeg vil gerne benytte det til dynamisk at kunne styre højden af en <div>

Synes godt om

=maddog= Nybegynder

22. september 2003 - 14:31 #1

jeg bruger denne funktion
function getWD(direction){
var b1 = (window.innerWidth)?true:false; if (!b1) {
var b2 = (document.body.offsetWidth==document.body.clientWidth)?true:false;
var b3 = (document.body.offsetHeight==document.body.clientHeight)?true:false;
var b4 = (document.documentElement&&document.documentElement.clientWidth)?true:false; }
var sw = (b1)?window.innerWidth:(b2&&b4)?document.documentElement.clientWidth:document.body.clientWidth;
var sh = (b1)?window.innerHeight:(b3&&b4)?document.documentElement.clientHeight:document.body.clientHeight;
return (direction=="width")?sw:sh;
}

width = getWD("width"); // henter bredde
height = getWD("height"); // henter højde

Synes godt om

lklingenberg Nybegynder

22. september 2003 - 14:53 #2

det ser ok ud - hvordan får jeg det lettest sat ind i min <div> så den ved load bliver den højde der sættes i getWD("height")

Synes godt om

=maddog= Nybegynder

22. september 2003 - 15:03 #3

noget lignende
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title>Untitled</title>
<style type="text/css">
body {margin:0px; overflow:hidden;}
</style>
<script type="text/javascript">
function getWD(direction){
var b1 = (window.innerWidth)?true:false; if (!b1) {
var b2 = (document.body.offsetWidth==document.body.clientWidth)?true:false;
var b3 = (document.body.offsetHeight==document.body.clientHeight)?true:false;
var b4 = (document.documentElement&&document.documentElement.clientWidth)?true:false; }
var sw = (b1)?window.innerWidth:(b2&&b4)?document.documentElement.clientWidth:document.body.clientWidth;
var sh = (b1)?window.innerHeight:(b3&&b4)?document.documentElement.clientHeight:document.body.clientHeight;
return (direction=="width")?sw:sh;
}
onload = function() {
main2 = document.getElementById("main");
main2.style.height = getWD("height")+"px";
main2.style.width = getWD("width")+"px";
}
onresize = window.onload;
</script>
</head>
<body>
<div id="main" style="border:1px solid black;"> Mit indhold </div>
</body>
</html>

Synes godt om

lklingenberg Nybegynder

22. september 2003 - 15:29 #4

hm, jeg ser nu at den funktion netop er det jeg ikke leder efter ;-) din funktion finder jo højden af browservinduet og _ikke_ hvor mange pixels dokumentet udstrækker sig (inkl. det man evt. skal scrolle sig frem til), hvilket er det jeg leder efter.
Se problematikken på http://www.ifi.ku.dk/kudesign/kudesign/subside.asp. Venstremenu skal helst udstrække sig fra top til bund i hele dokumentets længde.

Synes godt om

=maddog= Nybegynder

22. september 2003 - 15:37 #5

okey. hvad skal der ske hvis størrelsen er MINDRE en scroll højden.
scroll højden er AFAIK document.body.scrollHeight.
jeg må smutte.

Synes godt om

lklingenberg Nybegynder

22. september 2003 - 23:04 #6

Jeg er interesseret i at bar'en til venstre til en hver tid fylder hele skærmbilledet (som om det var en background sat til repeat-y), dvs. uanset om teksten udfylder skærmbilledet eller om man skal scrolle. Jeg er dog ikke interesseret i at siden automatisk reloader hvis brugeren fx ændrer skriftstørrelse eller størrelsen på vinduet. Jeg er heller ikke interesseret i at ændre bredden af elementet, hvorfor der må være et par linjer det kan pilles ud...?

Synes godt om

lklingenberg Nybegynder

22. september 2003 - 23:47 #7

Hov, det fungerer jo næsten nu - bortset fra at højden på min div i IE gerne skulle gå "helt i bund" ved korte dokumenter. Det må være noget med at tjekke om den ene værdi er større end den anden.

En anden ting: du tester for et par forskellige egenskaber og jeg lurer lidt på om det er for at komme eventuelle browserkompabilitetsproblemer i forkøbet...?

Synes godt om

lklingenberg Nybegynder

23. september 2003 - 00:13 #8

nøøøøj, så tror jeg den er ved at være der (og jeg har lært ikke så lidt om dhtml).

Nu fungerer det i IE6, Firebird, Mozilla, NS7.1 og Opera 7. Der er dog stadig problemer i Opera 5 og K-Meleon - kan du greje den, maddog?

function getHeight() {
var b1 = (window.innerHeight)?true:false; if (!b1) {
var b2 = (document.body.offsetHeight==document.body.scrollHeight)?true:false;
var b3 = (document.documentElement&&document.documentElement.clientHeight)?true:false; }
var scrollHeight = (b1)?window.innerHeight:(b2&&b3)?document.documentElement.scrollHeight:document.body.scrollHeight;
var trueHeight = (scrollHeight<document.documentElement.clientHeight)?document.documentElement.clientHeight:scrollHeight
return trueHeight;
}

onload = function() {
document.getElementById("menuLeft").style.height = getHeight()+"px";
}
onresize = window.onload;

Du må også gerne forklare lidt mere om de boolean-tests du laver undervejs - og smid så lige et svar undervejs også... ;-)

Synes godt om

=maddog= Nybegynder

23. september 2003 - 08:14 #9

O5 og Chameleon er uden for mit interesse felt. Jeg kan ikke hjælpe dig, men måske yde lidt trøst - ikke alle browsere er i stand til at udregne dokument-højden.

hgt = (document.body.clientHeight>document.body.scrollHeight)?document.body.clientHeight:document.body.scrollHeight;
er måske en let måde at hente højden, med skærmhøjden som minimum på.....

Synes godt om

lklingenberg Nybegynder

23. september 2003 - 08:45 #10

ok - takker for indsatsen! Gi'r du lige et svar...
/Lars

Synes godt om

lklingenberg Nybegynder

25. september 2003 - 10:14 #11

halloooo... =maddog=...?

Synes godt om

=maddog= Nybegynder

29. september 2003 - 11:51 #12

ohhhh soz.

Synes godt om

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.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
problem med download i <a href=" " download> tag i JavaScript Af Peer i JavaScript	5	27/04/202620:09	21/08/202610:41
Validering af filnavn i formular Af Strawberry i JavaScript	8	14/04/202610:11	20/04/202611:14
Mangler et JavaScript til htm side med iframe i Joomla5 Af Peder Lund Nielsen i JavaScript	2	03/02/202614:19	04/04/202616:02
Åbne en PDF fil fra en mappe Af mbl i JavaScript	9	18/04/202516:52	22/04/202512:33
Spørgsmål til cookies Af Mads i JavaScript	2	14/02/202511:47	27/06/202514:34

Se alle spørgsmål i kategorien Opret spørgsmål

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

Alle kategorier på Eksperten

Seneste artiklerRSS