Height of a html window's content (not just the viewport height)
Posted
by gatapia
on Stack Overflow
See other posts from Stack Overflow
or by gatapia
Published on 2010-03-23T02:59:40Z
Indexed on
2010/03/23
3:01 UTC
Read the original article
Hit count: 639
Hi All,
I'm trying to get the height of a html window's content. This is the full height of the content not the visible height. I have had some (very limited) success using:
document.getElementsByTagName('html')[0].offsetHeight in FireFox.
This however fails in IEs and it fails in Chrome when using absolute positioned elements (http://code.google.com/p/chromium/issues/detail?id=38999).
A sample html file that can be used to reproduce this is:
<html>
<head>
<style>
div {
border:solid 1px red;
height:2000px;
width:400px;
}
.broken {
position:absolute;
top:0;
left:0;
}
.fixed {
position:relative;
top:0;
left:0;
}
</style>
<script language='javascript'>
window.onload = function () {
document.getElementById('window.height').innerHTML = window.innerHeight;
document.getElementById('window.screen.height').innerHTML = window.screen.height;
document.getElementById('document.html.height').innerHTML = document.getElementsByTagName('html')[0].offsetHeight;
}
</script>
</head>
<body>
<div class='fixed'>
window.height: <span id='window.height'> </span> <br/>
window.screen.height: <span id='window.screen.height'></span> <br/>
document.html.height: <span id='document.html.height'></span> <br/>
</div>
</body>
</html>
Thanks All
Guido Tapia
© Stack Overflow or respective owner
