How to make the entire column change color after the mouse moves over a certain cell

How to make the entire column change color after the mouse moves over a certain cell_Form special effects

WBOY

Release： 2016-05-16 19:20:50

Original

1701 people have browsed it

[Ctrl A Select all Note: If you need to introduce external Js, you need to refresh to execute

]

The above code can realize mouse movement When the mouse is moved to a cell, the cell changes color. Now I want to make the entire column change color after the mouse moves over a certain cell. Is it possible?

.mytable td { 
    border-bottom: 1px solid #C1DAD7; 
    background: #fff; 
    font-size:12px; 
    padding: 6px 6px 6px 0px; 
    align:center; 
    color: #4f6b72; 
}

td.alt { 
    background: #F5FAFA; 
    text-align:center; 
    color: #797268; 
}

td.baialt { 
    background: #FFFFFF; 
    text-align:center; 
    color: #000; 
}

td.spec { 
    border-top: 0; 
    background: #fff ; 
    text-align:center; 
    font: 12px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; 
}

td.specalt { 
    border-top: 0; 
    background: #f5fafa ; 
    text-align:center; 
    font: 12px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; 
    color: #797268; 
} 
</style>

</div>

<p align="center">
           
            </p>
          <div align="center">When the mouse passes over, you want to change the color of every column (preferably invert the color). The effect example is as follows: <table class="mytable" cellspacing="0" id="table2"> 
        <tr align="center"> 
            <td class="baialt" height="45"></td> 
            <td class="alt" height="45"></td> 
            <td class="baialt" height="45"></td> 
            <td class="alt" height="45"></td> 
            <td class="baialt" height="45"></td> 
        </tr> 
          </table>
            <script defer>

var overcolor='#cccccc'; 
var outcolor='#f2f3f7'; 
var clkcolor='deeppink';

function init(){ 
for (var i=0;i<phx.rows.length;i++){ 
    for(var j=0;j<phx.rows[i].cells.length;j++){     
phx.rows[i].cells[j].bgColor=outcolor; 
    } 
} 
}

init();

</script>
          <script language="javascript"> 
function senfe(sid){ 
    var tds=sid.getElementsByTagName("td") 
    for(var i=0;i<tds.length;i++){ 
        if(tds[i].className=='alt'){ 
            tds[i].className="baialt"; 
        }else{ 
            tds[i].className="alt"; 
        } 
    } 
} 
</script> 
           
            </div>