even and uneven rows

[windandwaves]

Hi Gurus

Is there a way to accentuate even or uneven rows in a table or list?

TIA

- Nicolaas

[Evertjan.]

windandwaves wrote on 16 feb 2006 in
comp.infosystems.www.authoring.stylesheets:

Is there a way to accentuate even or uneven rows in a table or list?

css only you will need to class the rows by hand.

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

I just posted a javascript example here:

<http://groups.google.com/group/comp.lang.javascript/msg/c882a82c63bb03be>

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[windandwaves]

Evertjan. wrote:

windandwaves wrote on 16 feb 2006 in
comp.infosystems.www.authoring.stylesheets:

Is there a way to accentuate even or uneven rows in a table or list?

css only you will need to class the rows by hand.

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

I just posted a javascript example here:

<http://groups.google.com/group/comp.lang.javascript/msg/c882a82c63bb03be>

Thanks a million.

Can you explain the syntax below. I understand what it does, but I do not
understand why!

i++ % 2

[Evertjan.]

windandwaves wrote on 16 feb 2006 in
comp.infosystems.www.authoring.stylesheets:

Can you explain the syntax below. I understand what it does, but I do
not understand why!

i++ % 2

"give the remainder of i/2 and then increment i"

n being a number:
if (n) alert('n is NOT zero');
--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[Alan J. Flavell]

On Thu, 16 Feb 2006, Evertjan. wrote:

Is there a way to accentuate even or uneven rows in a table or list?

css only you will need to class the rows by hand.

^^^^^^^^^

Not exactly true. You might well decide that it's a more convenient
solution, but it can be done without, by using sibling selectors.

I've spelled an example out in detail, with the CSS enclosed for
convenience of reading - but in practice it could be simplified, and
of course the CSS would normally be put elsewhere.

http://ppewww.ph.gla.ac.uk/~flavell/tests/tablefun.html

Obviously you'd need a www-compatible browser to see this working
(I used Mozilla 1.7 and Opera 8.5).

[Yourself]

"Alan J. Flavell" <fl*****@physics.gla.ac.uk> wrote in message
news:Pi*******************************@ppepc56.ph. gla.ac.uk...

On Thu, 16 Feb 2006, Evertjan. wrote:

> Is there a way to accentuate even or uneven rows in a table or list?

css only you will need to class the rows by hand.

^^^^^^^^^

Not exactly true. You might well decide that it's a more convenient
solution, but it can be done without, by using sibling selectors.

I've spelled an example out in detail, with the CSS enclosed for
convenience of reading - but in practice it could be simplified, and
of course the CSS would normally be put elsewhere.

http://ppewww.ph.gla.ac.uk/~flavell/tests/tablefun.html

Obviously you'd need a www-compatible browser to see this working
(I used Mozilla 1.7 and Opera 8.5).

A better solution (for the time being) is to use Javascript. It's very easy
to implement, and would have wider support than sibling selectors.

[Alan J. Flavell]

On Thu, 16 Feb 2006, Yourself wrote:

A better solution (for the time being) is to use Javascript.
You don't get to execute Javascript on my browser, at least not until
you've given me some reason to trust what you're up to.
It's very easy to implement,
As long as it does no real harm when it's ignored, I won't mind.
and would have wider support than sibling selectors.

CSS is also optional, by design. Browsers which do not support
sibling selectors are required to ignore the associated properties,
just as for any other part of CSS which they don't understand.

CSS is designed specifically for presentation, in a way that JS is
not. I'd say that those who want the best presentation would be well
advised to get a capable browser. But I won't mind if they prefer not
to take my presentation proposals - that's all part of the design of
CSS.

So it's six of one and half a dozen of the other.

h t h

[Yourself]

"Alan J. Flavell" <fl*****@physics.gla.ac.uk> wrote in message
news:Pi*******************************@ppepc56.ph. gla.ac.uk...

On Thu, 16 Feb 2006, Yourself wrote:

A better solution (for the time being) is to use Javascript.
You don't get to execute Javascript on my browser, at least not until
you've given me some reason to trust what you're up to.

Well, it won't work if you have Javascript disabled, no.

It's very easy to implement,

As long as it does no real harm when it's ignored, I won't mind.

Nope, no harm at all, you just won't get different styles for odd rows in
tables

and would have wider support than sibling selectors.

CSS is also optional, by design. Browsers which do not support
sibling selectors are required to ignore the associated properties,
just as for any other part of CSS which they don't understand.

CSS is designed specifically for presentation, in a way that JS is
not. I'd say that those who want the best presentation would be well
advised to get a capable browser. But I won't mind if they prefer not
to take my presentation proposals - that's all part of the design of
CSS.

No JS (or ECMAScript) is not designed for presentation, but because of
different levels of support for CSS in different browsers, doing something
like styling odd rows in tables is difficult in CSS alone. Using ECMAScript
to do the job until CSS is supported better in browsers is a good
compromise. The DOM level 1 has good support in most browsers (better than
CSS), so more people will see your nice odd row colourings if you use
ECMAScript.

Unless they have Javascript disabled of course. But as it's just a visual
enhancement, it doesn't really matter if they have Javascript disabled in
this instance.
So it's six of one and half a dozen of the other.

It certainly is
h t h

[Tony]

Yourself wrote:

No JS (or ECMAScript) is not designed for presentation, but because of
different levels of support for CSS in different browsers, doing something
like styling odd rows in tables is difficult in CSS alone.
I suppose it might be if you don't want to manually declare the class
for each row.

Of course, that's not that hard if the page is dynamically generated -
just have the server-side script output classes as you alternate each
row:

<tr class="evenRow">.....</tr>
<tr class="oddRow">.....</tr>
Using ECMAScript
to do the job until CSS is supported better in browsers is a good
compromise.
Most browsers in common use support styles declared like what I did
above.. :)
The DOM level 1 has good support in most browsers (better than
CSS), so more people will see your nice odd row colourings if you use
ECMAScript.
Just curious - how do you change the color, if not by setting a CSS
style property for the row?
Unless they have Javascript disabled of course. But as it's just a visual
enhancement, it doesn't really matter if they have Javascript disabled in
this instance.

Then it shouldn't matter if they don't have CSS support, either.

I'm confused....

[Yourself]

"Tony" <to****@dslextreme.com> wrote in message
news:11*********************@z14g2000cwz.googlegro ups.com...

Yourself wrote:

No JS (or ECMAScript) is not designed for presentation, but because of
different levels of support for CSS in different browsers, doing
something
like styling odd rows in tables is difficult in CSS alone.
I suppose it might be if you don't want to manually declare the class
for each row.

Yes it might be

Of course, that's not that hard if the page is dynamically generated -
just have the server-side script output classes as you alternate each
row:

<tr class="evenRow">.....</tr>
<tr class="oddRow">.....</tr>

No it's not that hard, you don't even have to specify a class for the even
(or odd) rows.

Using ECMAScript
to do the job until CSS is supported better in browsers is a good
compromise.

Most browsers in common use support styles declared like what I did
above.. :)

Can't make head or tail of that sentence.

The DOM level 1 has good support in most browsers (better than
CSS), so more people will see your nice odd row colourings if you use
ECMAScript.

Just curious - how do you change the color, if not by setting a CSS
style property for the row?

You don't, but if the table isn't dynamically generated server side, then
it's easier to use a client side script to change the style of each row,
rather than manually adding classes.

If you are using server side scripting to generate the table, then it's a
choice between having more core markup just for presentation, or doing it
client side which means people won't see the stylings if they have
Javascript disabled.

Unless they have Javascript disabled of course. But as it's just a
visual
enhancement, it doesn't really matter if they have Javascript disabled in
this instance.

Then it shouldn't matter if they don't have CSS support, either.

That's right.
I'm confused....

So am I.

[Alan J. Flavell]

On Thu, 16 Feb 2006, Tony wrote, quoting s/one posting as "Yourself":

Of course, that's not that hard if the page is dynamically generated -
just have the server-side script output classes as you alternate each
row:

<tr class="evenRow">.....</tr>
<tr class="oddRow">.....</tr>

OK, but you really don't need to set a class on both of them - just
set a default style, and then apply a class to the /alternate/ rows.

Using ECMAScript to do the job until CSS is supported better in
browsers is a good compromise.

Most browsers in common use support styles declared like what I did
above.. :)

Indeed. However, if you want to style alternate *columns* too, it
does tend to bloat the HTML. It's no different in principle than
rows, but the bloated results are unfortunate.

The CSS for doing sibling styling can also be regarded as somewhat
bloated, but otherwise seems to me to be the right approach in
principle: the point of disagreement is about browser support, but
we've been told we (as web authors) should show no pity to IE7, just
treat it as if it were a WWW-compatible browser, so I'm inclined to
take that at its word in future.

As long as the styling isn't intended to convey substantive meaning,
then I think any of the techniques discussed here are defensible;
myself, I'd be happier defending the CSS approach than the JS
approach, but I recognise that others have their own views.

(And if the styling /is/ intended to convey substantive meaning, then
it's a WAI violation, so I'd want to steer clear of that.)

best

[windandwaves]

Alan J. Flavell wrote:

On Thu, 16 Feb 2006, Evertjan. wrote:

Is there a way to accentuate even or uneven rows in a table or list?

css only you will need to class the rows by hand.

^^^^^^^^^

Not exactly true. You might well decide that it's a more convenient
solution, but it can be done without, by using sibling selectors.

I've spelled an example out in detail, with the CSS enclosed for
convenience of reading - but in practice it could be simplified, and
of course the CSS would normally be put elsewhere.

http://ppewww.ph.gla.ac.uk/~flavell/tests/tablefun.html

Obviously you'd need a www-compatible browser to see this working
(I used Mozilla 1.7 and Opera 8.5).

How does the + work?

Cheers

Nicolaas