Bug in MS IE 6.0 SP1 in processing DHTML


A

Alexandr Klaus

I don't know what is this. I'm thinking that it's bug.
Look at this HTML-page:

<SCRIPT LANGUAGE="JavaScript">
<!--
var isShow = false;

function fnShowItems()
{
var count = 0;
if (!isShow) { count = 7; isShow = true; }
else { count = 1000; isShow = false; }

var list = document.all.List;
for (var i=0; i<list.rows.length; i++)
{
if (i>=count) list.rows.style.display = 'none';
else list.rows.style.display = 'inline';
}
}
//-->
</SCRIPT>
<DIV id='LayerData' style='overflow: auto; height:150px; width:280;
position: static'>
<p>
<TABLE id="List" ALIGN="CENTER" border="1">
<tr>
<td><b>col #1</b></td><td><b>col #2</b></td>
</tr>
<tr style="background-color: #cfdbea;">
<td>data1</td><td>data2</td>
</tr>
<tr> <td>14.01.03</td><td>value</td> </tr>
<tr> <td>15.01.03</td><td>value</td> </tr>
<tr style="background-color: #cfdbea;">
<td>&nbsp;&nbsp;data1</td><td>data2</td>
</tr>
<tr> <td>01.02.03</td><td>value</td> </tr>
<tr> <td>02.02.03</td><td>value</td> </tr>
<tr> <td>03.02.03</td><td>value</td> </tr>
<tr> <td>04.02.03</td><td>value</td> </tr>
<tr> <td>05.02.03</td><td>value</td> </tr>
<tr> <td>06.02.03</td><td>value</td> </tr>
<tr> <td>07.02.03</td><td>value</td> </tr>
<tr> <td>08.02.03</td><td>value</td> </tr>
<tr> <td>09.02.03</td><td>value</td> </tr>
<tr> <td>10.02.03</td><td>value</td> </tr>
<tr> <td>11.02.03</td><td>value</td> </tr>
</table>
</DIV>
<P><input type='button' value='Press' onClick='fnShowItems()'>

Please, press twice the button down of page. JavaScript must to show
or to hide some rows in the table. There are interesting
feature after this action: layer (<div></div>) are moving up or down
on page.

If remove table's property ALIGN='CENTER' or change this on
ALIGN='LEFT', then trouble will be disappear.
This trouble are observing with dynamic changing of table only and if
DIV has style OVERFLOW: AUTO.

Is it bug or feature ?

P.S. Sorry for my previos message
 
Ad

Advertisements

R

Richard Cornford

if (i>=count) list.rows.style.display = 'none';
else list.rows.style.display = 'inline';

<snip>

As I recall, the default values for the CSS display property of a TR
element is "table-row" in CSS2 and "block" in CSS1. So if the property
is set to "inline", and the browser acts on that, then the result will
be undesirable. It is usual to re-impose the default display property by
setting the value of that property on the style object to an empty
string (which also avoids having to worry about which version of CSS the
browser implements in this respect).

if (i>=count) list.rows.style.display = 'none';
else list.rows.style.display = '';

Richard.
 

Top