Saturday, 15 January 2011

How to make hover on table cells with Javascript? -



How to make hover on table cells with Javascript? -

i have table hover function on rows, trying alter hover on cells instead

here's current script:

<script type="text/javascript"> window.onload=function(){ var tfrow = document.getelementbyid('tfhover').rows.length; var tbrow=[]; (var i=1;i<tfrow;i++) { tbrow[i]=document.getelementbyid('tfhover').rows[i]; tbrow[i].onmouseover = function(){ this.style.backgroundcolor = '#f3f8aa'; }; tbrow[i].onmouseout = function() { this.style.backgroundcolor = '#ffffff'; }; } }; </script>

and here tried alter far still not working:

<script type="text/javascript"> window.onload=function(){ var tfcell = document.getelementbyid('tfhover').cells.length; var tbcell=[]; (var i=1;i<tfcell;i++) { tbcell[i]=document.getelementbyid('tfhover').cells[i]; tbcell[i].onmouseover = function(){ this.style.backgroundcolor = '#f3f8aa'; }; tbcell[i].onmouseout = function() { this.style.backgroundcolor = '#ffffff'; }; } }; </script>

how can accomplish hover on cell instead of hover on row script?

you can utilize regular css purpose:

#tfhover td { background-color: #fff; } #tfhover td:hover { background-color: #f3f8aa; }

thanks @mike brant pointing out missing table id

javascript hover

No comments:

Post a Comment