trying to set row color

[SAM]

Le 10/25/09 4:46 PM, JR a écrit :

Hi Stéphane,
I've just watched a video about Javascript optimization in which
Nicholas C. Zakas, from Google Inc, recommended changing className
instead of style property:

I'm downloading it.
(more than half an hour to wait)

It reduces the number of DOM reflows in a loop (if I understood it
correctly).

I'd like to thank you and tell you that I put your advices into
practice:
http://www.jrfaq.com.br/sortable.htm

Fine ;-)

But I'ld do :
table.sortable tbody tr:hover { background-color: #c9c9c9; }

instead of :
table.sortable tbody tr.odd:hover { background-color: #c9c9c9; }
table.sortable tbody tr.even:hover { background-color: #c9c9c9; }

And I wouldn't create a specific class (even) for the default state
table.sortable tbody tr { background-color: #fff; }
table.sortable tbody tr.odd { background-color: #f0f0f0; }

(I don't know what could say Nicholas C. Zakas of that)

 

[Evertjan.]

SAM wrote on 29 okt 2009 in comp.lang.javascript:

But I'ld do :
table.sortable tbody tr:hover { background-color: #c9c9c9; }

Which is just shorthand for:

table.sortable tbody tr:hover td { background-color: #c9c9c9; }

==========================

To see that <tr> does not have a background colour, try:

<table class='sortable'>
<tr><td>qqqqqqqqqq<td>zzzzzzzzzzzzzz
<tr><td>qqqqqqqqqq
<tr><td>qqqqqqqqqq<td>zzzzzzzzzzzzzz
</table>

 

[SAM]

Le 10/29/09 10:51 AM, Evertjan. a écrit :

SAM wrote on 29 okt 2009 in comp.lang.javascript:


Which is just shorthand for:

table.sortable tbody tr:hover td { background-color: #c9c9c9; }

Yes, that have been told some posts before

==========================

To see that <tr> does not have a background colour, try:

And then ?
The purpose being to get same color for all the row, goal is reached.
(white spaces between cells don't disturb me, more I find that more
readable, clearer. A good idea that to do not colorize TRs.)

 

[Evertjan.]

SAM wrote on 29 okt 2009 in comp.lang.javascript:

Le 10/29/09 10:51 AM, Evertjan. a écrit :

Yes, that have been told some posts before

If I understand your English correctly,
you do not like it to be told again?

Well that is a pily, but I write to the NG, not to you specifically,
and thae NG should be aware your way is a shortcut.

And then ?
The purpose being to get same color for all the row, goal is reached.

Your purpose perhaps, not mine.

(white spaces between cells don't disturb me,

My purpose is not to disturb you [or not], but to inform the NG.

more I find that more
readable, clearer. A good idea that to do not colorize TRs.)

Eh? There is no difference beween the results of your shortcut and my
complete CSS in modern browsers, at least not in Chrome.

The spaces between the TD's are not coloured by the "TR background
colour", only by the table background colour or upwards elemaents in the
cascade, and are not necessarily white.

 

[Osmo Saarikumpu]

Evertjan. kirjoitti:

To see that <tr> does not have a background colour, try:

<table class='sortable'>
<tr><td>qqqqqqqqqq<td>zzzzzzzzzzzzzz
<tr><td>qqqqqqqqqq
<tr><td>qqqqqqqqqq<td>zzzzzzzzzzzzzz
</table>

I tried but wasn't convinced. Your turn now:

<table>
<tr><td>a
<tr id="bg"><td>b
<tr><td>c
</table>
<script type="text/javascript">
var row = document.getElementById('bg');
row.style.backgroundColor = 'red';
</script>

HTH,
Osmo

 

[VK]

Evertjan. kirjoitti:



I tried but wasn't convinced. Your turn now:

<table>
<tr><td>a
<tr id="bg"><td>b
<tr><td>c
</table>
<script type="text/javascript">
var row = document.getElementById('bg');
row.style.backgroundColor = 'red';
</script>

You didn't try the "right" one
row's color would be ignored on IE6 and earlier so such color
manipulation has been taboozed at some prehistoric time. Now it is a
personal programmer decision to keep following IE6-implied taboos or
to screw on them. For a web-wide solution I wouldn't call IE6 screwing
as an extremely cool idea as of the end of 2009.

http://marketshare.hitslink.com/bro...x?qprid=2&qpmr=40&qpdt=1&qpct=3&qptimeframe=M
Used methodology:
http://marketshare.hitslink.com/

 

[Evertjan.]

Osmo Saarikumpu wrote on 29 okt 2009 in comp.lang.javascript:

Evertjan. kirjoitti:


I tried but wasn't convinced. Your turn now:

<table>
<tr><td>a
<tr id="bg"><td>b
<tr><td>c
</table>

You do not show a tr part that is not covered by a td.

<script type="text/javascript">
var row = document.getElementById('bg');
row.style.backgroundColor = 'red';
</script>

That some or all present browsers and perhaps the W3 specs
have implemented this illogicality of CSS syntax,
dos not mean we should follow it.

The same as for <tr> goes for <thead> and <tbody>,
should they have background colour that is not visible by itself
but only for the pedegree TDs?

See here that the backgrounds of the tr and tbody
in both middle rows are NOT coloured:

===========================================
<style type='text/css'>
table {background-color: red;color:white;}
table tbody {background-color: blue;}
table.a tbody tr:hover { background-color: #c9c9c9; }
table.b tbody:hover { background-color: #c9c9c9; }
</style>

<table class=a>
<tr><td>qqqqqqqqqq<td>zzzzzzzzzzzzzz
<tr><td>qqqqqqqqqq
<tr><td>qqqqqqqqqq<td>zzzzzzzzzzzzzz
</table>
<br>
<table class=b>
<tbody>
<tr><td>qqqqqqqqqq<td>zzzzzzzzzzzzzz
<tr><td>qqqqqqqqqq
<tr><td>qqqqqqqqqq<td>zzzzzzzzzzzzzz
</table>
=========================================

I would prefer to use the complete syntax,
because that is what is implremented in fact:

table tbody tr td {background-color: blue;}
table.a tbody tr:hover td { background-color: #c9c9c9; }
table.b tbody:hover tr td { background-color: #c9c9c9; }

The idea that elements can cascade properties that they themselfs do not
show is correct, but only if they get that property from higher up the
cascade chain. To assign such property to that element itself, while at
present possible, seems ridiculous to me.