Ich arbeite an einer Webanwendung mit Twitter Bootstrap. In einer unserer Ansichten gibt es eine Tabelle, die die Klasse .table-hover
verwendet. Es gibt einige bestimmte Zellen in der Tabelle, die ich jedoch nicht hervorheben möchte, wenn der Rest der Zeilen hervorgehoben wird. Welche Stilregeln sollte ich verwenden, um diesen Effekt zu erzielen?Entfernen Tabelle-Hover-Effekt für eine einzelne Zelle in einer Twitter-Bootstrap-Tabelle
Dies ist in etwa wie meine Ansicht Tabelle organisiert ist:
<table class="table table-hover">
<thead>
<tr>
<th />
<th>Header 1</th>
<th>Header 2</th>
<th>Header 3</th>
</tr>
</thead>
<tbody>
<tr>
<td rowspan="2">Row Group "Heading" 1</td>
<td>Content</td>
<td>Content</td>
<td>Content</td>
</tr>
<tr>
<td>Content</td>
<td>Content</td>
<td>Content</td>
</tr>
<tr>
<td rowspan="2">Row Group "Heading" 2</td>
<td>Content</td>
<td>Content</td>
<td>Content</td>
</tr>
<tr>
<td>Content</td>
<td>Content</td>
<td>Content</td>
</tr>
</tbody>
</table>
Ich möchte die Zellen machen, die zwei Zeilen umspannen nicht markieren, wenn sie über schwebte sind.
EDIT:
ich diese CSS versucht:
td.rowTitle:hover { background-color: transparent; }
Es funktioniert nicht, leider. Ich denke es kann sein, weil die ganze Zeile markiert ist, nicht nur die Zelle ...
es entspricht "tbody tr: hover td [rowspan]" und jQuery ist nicht notwendig – iamawebgeek