CSS: How do I trigger a hover on each cell of a table if their table header is hovered?

Question

假设我的表单元格中有不同种类的类来处理hover ，当它们的相应标头悬停在hover ，如何触发所有这些hover事件？

Answer 1

Here is a sample: http://jsfiddle.net/g0u2qtxo/2/

Snippet:

$(document).ready(function () {

$("#iTable td").hover(function () {
    alert("cell hover");
});

$("#iHead").hover(function () {
    alert("header hover");
    $("#iTable td").mouseenter();
});

});

Dependency: use jquery...

Answer 2

CSS effects to change style of rows on hover and JavaScript to handle click event.

See here: http://jsfiddle.net/5apnLjqt/

HTML:

<tr class="clickable" onclick="nav('http://www.google.com');">
        <td>Text</td>
        <td>Text</td>
</tr>

CSS:

tr.clickable:hover td { 
    background: #FFFF00; 
    cursor: pointer; 
}

JavaScript:

function nav (url) {
    window.open(url, '_blank');
}