I try to understand what could be the source of a problem with
displaying and hiding rows of tables using display:block/none.
I've read selfhtml but could not find any hint about that. Any
pointers why that can happen, or how I should take care of that
type of problem/effect are highly appreciated.
The problem...
A couple times the hiding/displaying works, but _occasionally_
the entries are hidden but _blank lines appear_, instead.
I must add that it worked correct with Firefox 1.0 and IE 6.0,
but it shows the faulty behaviour with Firefox 2.0 and Safari.
To keep it short I just put some excerpt of the code here; the
complete source (generated code) is www.gridbug.de/weapons.html
These HTML lines encapsulate the data lines to be handled...
<tr id='wc_Dagger' style='display: block;'>
<td colspan='3'>
<table cellpadding='0' cellspacing='0'>
...
And these JavaScript functions shall control the attribute...
prof = document.form1.profession.value
for (i = 0; i < weap_class_table.length; i++)
{
weap = weap_class_table[i]
hidediv('wc_'+weap)
}
for (i = 0; i < weap_class_table.length; i++)
{
weap = weap_class_table[i]
skills = document.getElementById('role_skills_'+weap).value
if (filter_set_contains (skills.substr (prof, 1)))
showdiv('wc_'+weap)
}
where showdiv()/hidediv() are essentially defined as...
document.getElementById(id).style.display = 'block';
document.getElementById(id).style.display = 'none';
(but have some more code to distinguish older browser versions).
One additional observation; before I put the hidediv() in an own
for-loop (formerly it was in the else-branch of the second loop),
the same problem could be seen with IE 6.0.
I assumed that the effect might be the result of some optimization
done by the browsers but could not find another way to avoid it.
Thank's for any hints or explanations what happens!
Janis