By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
439,971 Members | 1,451 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 439,971 IT Pros & Developers. It's quick & easy.

"Redraw" problem (blank lines) with display:block/none

P: n/a
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

Nov 6 '06 #1
Share this Question
Share on Google+
7 Replies


P: n/a
VK
<tr id='wc_Dagger' style='display: block;'>

That should be added into FAQ I think...

display: block is invalid rule for all browsers except the only one I
can easily name yourselve :-)

The proper display type for table rows is table-row, anything else is
disregarded - again exept the only browser you just named in your mind
:-)

Lucky for us at least the display reset works selectively and it
restores the *proper* default values for all UA's ("block" for you know
who, "table-row" for others).

This way the regular working solutions (unless some complicated display
rules inheritance is involved) as achieved in two steps:

1) remove all "display" rules for table rows except the ones you want
to have initially hidden; for these leave "display:none"

2) To dynamically hide a row you assign:
rowObject.style.display = 'none';
To dynamically reveal hidden row you assign:
rowObject.style.display = ''; // empty string

More complicated work around would be to detect the proper row
attribute for given UA ("table-row" or "block"), store it in variable
and use this variable in assignments.

Nov 6 '06 #2

P: n/a
VK said the following on 11/6/2006 1:15 PM:
> <tr id='wc_Dagger' style='display: block;'>

That should be added into FAQ I think...
CSS issues covered in a javascript FAQ, and this from someone who is
quick to proclaim things off-topic to clj. Interesting.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javascript FAQ - http://jibbering.com/faq
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Nov 6 '06 #3

P: n/a
VK wrote:
<tr id='wc_Dagger' style='display: block;'>

display: block is invalid rule for all browsers except the only one I
can easily name yourselve :-)
[...]
This way the regular working solutions (unless some complicated display
rules inheritance is involved) as achieved in two steps:
1) remove all "display" rules for table rows except the ones you want
to have initially hidden; for these leave "display:none"
2) To dynamically hide a row you assign:
rowObject.style.display = 'none';
To dynamically reveal hidden row you assign:
rowObject.style.display = ''; // empty string
That fixed it. Thank's a lot! :-)

Janis

Nov 7 '06 #4

P: n/a
VK
CSS issues covered in a javascript FAQ, and this from someone who is
quick to proclaim things off-topic to clj. Interesting.
Run-time table scripting is irrelevant to c.l.j. ? Let me remind you
the Chapter then:
<quote>The proposed comp.lang.javascript will be open to discussion on
all
aspects of JavaScript, as it relates to HTML, Java, Perl, the World
Wide Web in general, and other related languages. The scope of
discussion will specifically exclude matters which are *solely*
related to Sun Microsystems, Inc.'s Java language, which should be
discussed in comp.lang.java.</quote>

An issue like:
<tr style="display:block"- why my table gets all crooked on the
standard-compliant browsers?
is indeed relevant to styling rather than to scripting.

At the same time:
trObject.style.display = 'block'; - why my table goes nuts on the
standard-compliant browsers?
definitely *is* in direct relevance to scripting

P.S. Constructive criticism is always welcome. Contre-productive bias
will be procecuted to the full extend of the freedom of speech. :-)
:-|

Nov 7 '06 #5

P: n/a
VK wrote:
> <tr id='wc_Dagger' style='display: block;'>

That should be added into FAQ I think...
Your opinions are, as always, worthless.
display: block is invalid rule for all browsers except the only one I
can easily name yourselve :-)
Nonsense.
The proper display type for table rows is table-row,
That should be 'the default display type'.
anything else is disregarded -
<snip>

That would be "disregarded" in the sense of directly resulting in the
application of differing layout rules? (That is, not "disregarded at
all, but likely resulting in less than desirable outcomes).

Richard.

Nov 7 '06 #6

P: n/a
VK said the following on 11/7/2006 5:46 AM:
>CSS issues covered in a javascript FAQ, and this from someone who is
quick to proclaim things off-topic to clj. Interesting.

Run-time table scripting is irrelevant to c.l.j. ?
Go back and read what you posted:

<quote>
<tr id='wc_Dagger' style='display: block;'>
That should be added into FAQ I think...
</quote>

No attribution, no explanation, just that snippet. Go read your own post
again. And then you go on to babble about how style="display: works in
some browsers or not. And my friend, that is a CSS implementation issue.
Let me remind you the Chapter then:

<quote>The proposed comp.lang.javascript will be open to discussion on
all
aspects of JavaScript, as it relates to HTML, Java, Perl, the World
Wide Web in general, and other related languages. The scope of
discussion will specifically exclude matters which are *solely*
related to Sun Microsystems, Inc.'s Java language, which should be
discussed in comp.lang.java.</quote>
If you read the charter, in depth, this group is open to discussion
about anything *but* Java. So, does that mean that my Bose stereo is
on-topic here? I guess if I were scripting it maybe. But, CSS issues
belong in ciwas', not clj's, FAQ.

Yet, in a thread on the very same day you proclaim that IE specific
scripting issues are "off-topic to clj". So which is it? Is CSS on topic
and JS off topic or is that just another display of your intelligence in
action?

<URL:
http://groups-beta.google.com/group/comp.lang.javascript/browse_thread/thread/7846a0358ec64426/4c3331a2471ee471?lnk=gst&q=IE7+ActiveXObject+Randy +Webb&rnum=1#4c3331a2471ee471>

In case you forgot the thread where you were babbling about JScript
being off-topic here.
An issue like:
<tr style="display:block"- why my table gets all crooked on the
standard-compliant browsers?
is indeed relevant to styling rather than to scripting.
You got it!
At the same time:
trObject.style.display = 'block'; - why my table goes nuts on the
standard-compliant browsers?
definitely *is* in direct relevance to scripting
No, it is still a CSS issue.
P.S. Constructive criticism is always welcome. Contre-productive bias
will be procecuted to the full extend of the freedom of speech. :-)
:-|
You can attempt to "prosecute me to the full extent" but I typically do
not have a battle of wits with unarmed people and you are grossly unarmed.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javascript FAQ - http://jibbering.com/faq
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Nov 7 '06 #7

P: n/a
In message <11**********************@m73g2000cwd.googlegroups .com>, Tue,
7 Nov 2006 05:59:21, Richard Cornford <Ri*****@litotes.demon.co.uk>
writes
>VK wrote:
>> <tr id='wc_Dagger' style='display: block;'>

That should be added into FAQ I think...

Your opinions are, as always, worthless.

Nevertheless, over the past year there have been many <FAQENTRY>
suggestions for changes of the newsgroup FAQ, at least some of which
were good.

As of a day or two ago, the FAQ on the Web had not been updated for over
a year (and not posted here [see FAQ 1 para 4] for several months].

However, you are prepared to spend time on telling VK what every other
regular has read many times before (and may well agree with).

Now please read FAQ section 5.
I see only three sensible moves (though there may be others) :-
(a) You maintain the FAQ, making updates in a timely manner.
(b) You resign.
(c) You are deposed.

Which is it to be?

--
(c) John Stockton, Surrey, UK. ?@merlyn.demon.co.uk Turnpike v6.05 IE 6
<URL:http://www.jibbering.com/faq/>? JL/RC: FAQ of news:comp.lang.javascript
<URL:http://www.merlyn.demon.co.uk/js-index.htmjscr maths, dates, sources.
<URL:http://www.merlyn.demon.co.uk/TP/BP/Delphi/jscr/&c, FAQ items, links.
Nov 8 '06 #8

This discussion thread is closed

Replies have been disabled for this discussion.