aspose file tools*
The moose likes HTML, CSS and JavaScript and the fly likes What is the difference between height, scrollHeight and style.height Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login


Win a copy of The Java EE 7 Tutorial Volume 1 or Volume 2 this week in the Java EE forum
or jQuery UI in Action in the JavaScript forum!
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "What is the difference between height, scrollHeight and style.height" Watch "What is the difference between height, scrollHeight and style.height" New topic
Author

What is the difference between height, scrollHeight and style.height

John Smith
Ranch Hand

Joined: Aug 21, 2004
Posts: 48
Hi:

I have a IFrame called "dataFrame". Does anybody know the difference between

document.getElementById('dataFrame').height

and

document.getElementById('dataFrame').Document.body.scrollHeight;

and

document.getElementById('dataFrame').style.height



function shrinkIFrame() {

var theFrame=document.getElementById('dataFrame');
var header,headerHeight,footer,navPrimaryMenu,navPrimaryMenuHeight,mainMenu2,iFrameHeight,mainMenu2Height,wholeWindowHeight;
var totalHeight,differenceHeight;

if(theFrame){

theFrame.style.display="block"
if(theFrame.Document && theFrame.Document.body.scrollHeight)
{


header=parent.document.getElementById('Header2');
navPrimaryMenu=parent.document.getElementById('navPrimaryMenu');
mainMenu2=parent.document.getElementById('mainMenu2');

headerHeight = header.offsetParent.offsetHeight;
navPrimaryMenuHeight=navPrimaryMenu.scrollHeight;
mainMenu2Height=mainMenu2.scrollHeight;
wholeWindowHeight=document.body.offsetHeight;
iFrameHeight =theFrame.Document.body.scrollHeight;

totalHeight =headerHeight+mainMenu2Height+navPrimaryMenuHeight;

differenceHeight = wholeWindowHeight - totalHeight;



//alert("differenceHeight: " + differenceHeight);

if (iFrameHeight > differenceHeight)
{
// 92 represent the row header, one row and the scrollbar
//alert("iFrameHeight > differenceHeight");
if (differenceHeight > 92)
{

theFrame.style.height=differenceHeight+ 'px';
}
else
{
alert("theFrame.height:"+theFrame.height+"theFrame.Document.body.scrollHeight:"+theFrame.Document.body.scrollHeight);
alert("differenceHeight:"+differenceHeight+"theFrame.style.height:"+theFrame.style.height);

theFrame.height=theFrame.Document.body.scrollHeight;

}

}
else
{

theFrame.style.height = differenceHeight +'px';
}


}
if(theFrame.attachEvent){

theFrame.detachEvent("onload", readjustIframe)
theFrame.attachEvent("onload", readjustIframe)
}
}

}





Yours,

Frustrated
Dan Drillich
Ranch Hand

Joined: Jul 09, 2001
Posts: 1175
Hi John,

The following two code segments seem to be equivalent -



The height attribute is probably a deprecated one.

Regards,
Dan


William Butler Yeats: All life is a preparation for something that probably will never happen. Unless you make it happen.
Dan Drillich
Ranch Hand

Joined: Jul 09, 2001
Posts: 1175
Hi John,

Not much feedback at http://www.siteexperts.com/forums/viewConverse.asp?d_id=20241 :roll:

Regards,
Dan
Eric Pascarello
author
Rancher

Joined: Nov 08, 2001
Posts: 15376
    
    6
http://www.quirksmode.org/js/doctypes.html
 
I agree. Here's the link: http://aspose.com/file-tools
 
subject: What is the difference between height, scrollHeight and style.height