html - Change :hover CSS properties with JavaScript -
i need find way change css :hover properties using javascript.
for example, suppose have html code:
<table> <tr> <td>hover 1</td> <td>hover 2</td> </tr> </table>
and following css code:
table td:hover { background:#ff0000; }
i use javascript change <td> hover properties to, say, background:#00ff00. know access style background property using javascript as:
document.getelementsbytagname("td").style.background="#00ff00";
but don't know of javascript equivalent :hover. how change these <td>'s :hover background using javascript?
your appreciated!
pseudo classes :hover
never refer element, element satisfies conditions of stylesheet rule. need edit stylesheet rule, append new rule, or add new stylesheet includes new :hover
rule.
var css = 'table td:hover{ background-color: #00ff00 }'; var style = document.createelement('style'); if (style.stylesheet) { style.stylesheet.csstext = css; } else { style.appendchild(document.createtextnode(css)); } document.getelementsbytagname('head')[0].appendchild(style);
Comments
Post a Comment