Tabelle-CSS-Mouseover?

[LuNeX]

Ich hatte mir für 2007 auf meiner HP selbst einen Kalender gebastelt (z.B. November).

Mit JavaScript wird für jede Zeile ein Mouseover erzeugt, was sehr aufwendig ist, weil ich für jeden einzelnen Tag den Code für den Mouseovereffekt eingeben muss (siehe Quelltext bzw. hier kleiner Auszug).

<script type="text/javascript">
 function ein(x) {document.getElementById(x).style.backgroundColor="#FF9999";}
 function aus(x) {document.getElementById(x).style.backgroundColor="transparent";}
</script>
 <tr id="1" onMouseOver="ein('1');" onMouseOut="aus('1');">
  <td><div align="center"><strong>01.11.2007</strong></div></td> 
  <td><div align="center"><strong>Do</strong></div></td>

  <td><div align="center">305</div></td>
  <td><div align="center">61</div></td>
  <td><div align="center">44</div></td>
  <td>Allerheiligen (BY) </td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>
  <td>&nbsp;</td>

  <td>&nbsp;</td>
  <td>16:30=ND-LE</td>
 </tr>
 <tr id="2" onMouseOver="ein('2');" onMouseOut="aus('2');">
   <td><div align="center">02.11.2007</div></td>
   <td><div align="center">Fr</div></td>
   <td><div align="center">306</div></td>

   <td><div align="center">60</div></td>   <td><div align="center">&nbsp;</div></td><td>&nbsp;</td>
   <td>&nbsp;</td>
   <td>&nbsp;</td>
   <td>-06:30=ND-LE</td>
   <td>&nbsp;</td>
   <td>&nbsp;</td>
 </tr>

 <tr id="3" onMouseOver="ein('3');" onMouseOut="aus('3');">
   <td><div align="center">03.11.2007</div></td>
   <td><div align="center">Sa</div></td>
   <td><div align="center">307</div></td>
   <td><div align="center">59</div></td>   <td><div align="center">&nbsp;</div></td><td>&nbsp;</td>
   <td>&nbsp;</td>

   <td>&nbsp;</td>
   <td>&nbsp;</td>
   <td>&nbsp;</td>
   <td>16:30=ND-LE</td>
 </tr>
 <tr id="4" onMouseOver="ein('4');" onMouseOut="aus('4');">
   <td><div align="center"><strong>04.11.2007</strong></div></td>
   <td><div align="center"><strong>So</strong></div></td>

   <td><div align="center">308</div></td>
   <td><div align="center">58</div></td>   <td><div align="center">&nbsp;</div></td><td>&nbsp;</td>
   <td>Manuela</td>
   <td>&nbsp;</td>
   <td>-06:30=ND-LE</td>
   <td>&nbsp;</td>

   <td>&nbsp;</td>
 </tr>

usw.

In Vorbereitung des Kalenders für 2008 würde mich interessieren wie kann man das per CSS "automatisieren"?

[Blues]

AW: Tabelle-CSS-Mouseover?

zB

tr
{
background-color:xyz
}

tr:hover
{
background-color:abc
}

[threadi]

AW: Tabelle-CSS-Mouseover?

Was aber wiederum der IE nicht mitmacht ..

[LuNeX]

AW: Tabelle-CSS-Mouseover?

Was aber wiederum der IE nicht mitmacht ..

dann wäre das von Blues leider keine Alernative

[threadi]

AW: Tabelle-CSS-Mouseover?

Genau. Daher wäre deine JavaScript-Variante die einzig praktikable. Mittels php oder anderen unterstützenden Programmen könntest du das allerdings auch automatisch generieren lassen.