On Thu, 24 Apr 2008 11:17:42 +0200, liketofindoutwh y
<li************ **@gmail.comwro te:
>
for the code
var node = document.getEle mentById("somet hing")
alert(node.offs etWidth)
is very similar to node.clientWidt h and node.scrollWidt h
I just wonder why offsetWidth is well documented in the Definitive
Javascript book, but clientWidth and scrollWidth are not mentioned at
all, even when all 3 of them work in IE6, IE 7, Firefox 2, and Safari
3.
Also it seems that scrollWidth is always the same as offsetWidth. I
can't make them different by hiding some part of that element so that
one value is smaller and one is larger.
I have no intimate knowledge of the subject, but making them all 3
different is no trouble at all:
<html>
<head><title>te st</title>
<script type="text/javascript">
function test(elm){
alert('offsetwi dth:' + elm.offsetWidth + ', scrollWidth: '
+ elm.scrollWidth + ', clientWidth: ' + elm.clientWidth );
}
</script>
</head>
<body>
<div onclick="test(t his)"
style="display: block;width:8em ;height:3em;ove rflow:scroll;">
aaaaaaaaaaaaaaa aaaaaaaaaaaaaaa aaaaaaaaaaaaaaa aaaaaaaa<br>
aaaaaaaaaaaaaaa aaaaaaaaaaaaaaa aaaaaaaaaaaaaaa aaaaaaaa<br>
aaaaaaaaaaaaaaa aaaaaaaaaaaaaaa aaaaaaaaaaaaaaa aaaaaaaa<br>
aaaaaaaaaaaaaaa aaaaaaaaaaaaaaa aaaaaaaaaaaaaaa aaaaaaaa<br>
aaaaaaaaaaaaaaa aaaaaaaaaaaaaaa aaaaaaaaaaaaaaa aaaaaaaa<br>
aaaaaaaaaaaaaaa aaaaaaaaaaaaaaa aaaaaaaaaaaaaaa aaaaaaaa<br>
aaaaaaaaaaaaaaa aaaaaaaaaaaaaaa aaaaaaaaaaaaaaa aaaaaaaa<br>
aaaaaaaaaaaaaaa aaaaaaaaaaaaaaa aaaaaaaaaaaaaaa aaaaaaaa<br>
aaaaaaaaaaaaaaa aaaaaaaaaaaaaaa aaaaaaaaaaaaaaa aaaaaaaa<br>
</div>
</body>
</html>
Results (FF2)here: 128, 477,112; I suspect, but feel free to correct me:
offsetWidth: width on page
scrollWidth: total width of element from left to right (so in this case
scrollable content).
clientWidth: visible portion of width due to existance of scrollbar.
--
Rik Wasmus
