Tabellenzeilen ein- bzw. ausblenden

[Gunnar Bittersmann]

@@Gunnar Bittersmann:

nuqneH

Für IE 7 zusätzlich:
*+html tbody.compact tr:first-child { display: block }

IE 6 ist hoffentlich irrelevant.

Falls nicht:

* html tbody.compact tr.first-child { display: block }

Dazu jeder ersten Tabellenzeile in jedem 'tbody' die Klasse "fist-child" verpassen – natürlich nicht im Markup, sondern per JavaScript; und das muss auch nicht für alle Browser sein, sondern nur für IE < 7. Kann man per CSS-Expression tun:

* html tbody { display: expression( [code lang=javascript](new Function('el', '\  
[code lang=javascript]  el.firstChild.className += " first-child";\  
  el.style.display = "block";

'))(this) )[/code] }[/code]

Aber es sollte alles eingeblendet sein:

Und das sollte es auch, wenn JavaScript nicht ausgeführt wird. Per
  <script type="text/javascript">[code lang=javascript]document.documentElement.className += " js";</script>[/code]
dem 'html'-Element die Klasse "js" verpassen und per Nachfahrenselektor ausblenden  [PERFORMANCE-BP2]:

.js tbody.compact tr  { display: none }  
  
.js tbody.compact tr:first-child { display: table-row }  
  
*+html.js tbody.compact tr:first-child { display: block }  
  
* html.js tbody.compact tr.first-child { display: block }  
  
* html.js tbody { display: expression( [code lang=javascript](new Function('el', '[code lang=javascript]el.firstChild.className += " first-child"; el.style.display = "block";
~~~'))(this)[/code] ) }[/code]  
  
Qapla'

-- 
Volumen einer Pizza mit Radius z und Dicke a: pi z z a