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

Popular posts from this blog

javascript - backbone.js Collection.add() doesn't `construct` (`initialize`) an object -

php - Get uncommon values from two or more arrays -

Adding duplicate array rows in Php -