Forum Moderators: open

Message Too Old, No Replies

scrollHeight - strange behavior on IE

The scrollHeight property doesn't seem to work inside a table

         

Maxxc

7:21 pm on Jun 7, 2004 (gmt 0)

10+ Year Member



I just discovered a strange behavior in IE with the scrollHeight property. Try the following link and see for yourself: [cerberos.de...]
The second alert should also report a height other than 0. Look carefully at the source of the file.

It seems that the scrollHeight property returns the wrong height if the javascript code and the target element are inside a table.

I'm very curious if there is an explanation to this.

vkaryl

12:11 am on Jun 8, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Um. Specific links like that aren't a good idea. You should probably get rid of it before a mod does....

Purple Martin

12:58 am on Jun 8, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I found this article which has browser comparison tables for properties such as scrollHeight. It might help explain things.
[quirksmode.org...]

Maxxc

5:50 am on Jun 8, 2004 (gmt 0)

10+ Year Member



@vkaryl: I thought posting all the source would be too long. But I you are right so I'll post it here.

@Purple Martin: Thanks for the link. But it doesn't explain wht's happening in my example. And a change of the Doctype doesn't make any diference.

To make the post shorter I only post the HTML code between the body tags:

<div id="test_1">Test Element 1</div>

<table>
<tr>
<td>
<div id="test_2">Test Element 2</div>
<script type="text/javascript">
<!--
alert(document.all["test_1"].scrollHeight); // 19
alert(document.all["test_2"].scrollHeight); // 0!
alert(document.all["test_2"].innerHTML); // Test Element 2 (just to be sure if other properties exist)
//-->
</script>
</td>
</tr>
</table>

<script type="text/javascript">
<!--
alert(document.all["test_1"].scrollHeight); // 19
alert(document.all["test_2"].scrollHeight); // 19
//-->
</script>

The alerts report the following on IE5 - IE6:

19
0
Test Element 2
19
19

The second value (0) is the problem. I can't find any explanation why this is happening. Especially because the same Javascript called outside the table a few lines below works perfectly.