0

テキストの色に影響を与えることなく、マウスをホバーすると指定された特定の色に変化する、各セルの色が異なるテーブルが必要です。JavaScriptなしでも可能ですか?
異なる色の3つのセルを持つ私の単純なテーブルは

<table>
<tr>
<td bgcolor="red">Red</td>
<td bgcolor="blue">Blue</td>
<td bgcolor="green">Green</td>
</tr>
</table>

テキストの色を変更しても、セルには影響しません。簡単なスクリプトでこれが欲しい。

4

3 に答える 3

0

クラスを追加し (私の例では "tablecell")、bgcolor を削除します。

CSS の方法:

.tablecell:hover {
    background-color:#000000; // Put color you want it to be on hover here.
}
.tablecell {
    background-color:#FF0000; // Put color you wan tit to be on not-hover here (optional)
}

Javascript の方法:

myElement.addEventListener("onmouseover", mouseIn);
myElement.addEventListener("onmouseout", mouseOut);

function mouseIn() {
    this.style.backgroundColor = "#000000";
}

function mouseOut() {
    this.style.backgroundColor = "#FF0000";
}

jQuery の方法:

$(".tablecell").on("hover", mouseIn, mouseOut); // functions above
于 2012-07-01T15:50:41.890 に答える
0

bgcolorはい、10 年前の属性の代わりに CSS を使用します。

于 2012-07-01T15:40:36.037 に答える
0

このようなもの:

<style type="text/css">
        .td_hover { background-color: white; }
        .td_hover:hover { background-color: yellow; }
        .bg_red { background-color: red; }
        .bg_blue { background-color: blue; }
        .bg_green { background-color: green; }
</style>
<table>
    <tr>
        <td class="td_hover bg_red">Red</td>
        <td class="td_hover bg_blue">Blue</td>
        <td class="td_hover bg_greed">Green</td>
    </tr>
</table>
于 2012-07-01T15:53:10.950 に答える