MouseOver Tabellenzeile aufklappen

Steusi

Nasenbär
Hallo Leute,

ich habe ewig nichts mehr mit CSS gemacht, aber bei einem aktuellen Projekt wäre es doch ganz nützlich. Ich habe eine Tabelle, zu jeder Zeile gibt es Zusatzinformationen, die aber nicht in Layout passen würden. Deshalb würde ich diese gern mit einem MouseOver-Effekt einblenden.

Was ich habe und klappt:
CSS:
<style type="text/css">
a.atr .bpop {
	background-color: #fcc;
	display: none;
}
a.atr:hover .bpop {
	display: block;
}
</style>
HTML:
<a class="atr" href="#">
	Text
	<span class="bpop">
	Zusatzinformationen
	</span>
</a>

Möchte dies nun aber auf folgenden Quellcode anpassen:
PHP:
        echo('<a class="atr" href="#">');
        echo("<tr>");
        echo("<td>".$result->number."</td>");
        echo("<td>".$result->name."</td>");
        echo("<td>".$result->lineup."</td>");
        echo("<td>".$result->status."</td>");
        echo("<td>".$result->carton."</td>");
        echo("<td>".$result->piece."</td>");
        
        echo('</tr><span class="bpop">');
        echo("<tr>");
        echo('<td colspan="6">Zusatzinfo</td>');
        echo("</tr></span></a>");

Wie kann ich mein CCS-Code verschachteln, um an die Tabellenfelder zu kommen? Wenn eine Zelle in der Zeile berührt wird, soll darunter eine zusätzliche Zeile erscheinen.

Hoffe jemand kann mir da weiterhelfen.
Danke



// edit
Beispiel wäre auch auf 2 DIVs anwendbar

HTML:
<div id=0>
  <div id=1>
  </div
  <div id=2>
  </div>
</div>
Mit id=0 kann man untere/integrierte Tags ansprechen, aber Bereiche gleichen Ranges haben wohl keinen Einfluss aufeinander oder?
 
Zuletzt bearbeitet:
Zurück