Hallo,
ich möchte gerne per Click in einer Tabelle eine zusätzliche Zeile ausklappen. Dabei soll diese Zeile eine andere Farbe als die ursprüngliche Tabellenfarbe haben. Ich bekomme es allerdings nicht hin, die Tabelle hat immer die Farbe bzw. den Farbverlauf der in der Klasse .tabelle festgelegt wird.
Wie kann ich diese Farbe überschreiben lassen? Vielen Dank für Eure Antworten!
Code
<!doctype html>
<script>
function show(element) {
x = document.getElementById(element);
if(x.style.visibility === 'visible') {
x.style.visibility = 'collapse';
} else {
x.style.visibility = 'visible';
}
}
</script>
<style>
.collapse { visibility:collapse;
background-color: coral;}
.tabelle tr {
background-image: linear-gradient(white, #eee);
}
</style>
<p><a href="#" onclick="show('ghost')"> hier</a> klicken</p>
<table class="tabelle">
<tr>
<td>
<p>Dieser Bereich ist sichtbar (immer).</p>
</td>
</tr>
<tr class="collapse" id="ghost">
<td>
<p>Dieser Bereich kann ein-/ausgeblendet werden!</p>
</td>
</tr>
</table>
Alles anzeigen