Question

-4

set style with :hover javascript

rated 0 times [ 3] [ 7] / answers: 1 / hits: 24864 / 13 Years ago, sun, may 15, 2011, 12:00:00

I understand that the following method is great for setting CSS styles because of browser compatibility.

element.style.cssText = color:red;;

What I can't do is use cssText to apply styles on the :hover and :focus CSS events.

What do I do instead of this?

element.style.cssText = :focus{color:red;};

P.S. Don't mention using javascript events such as onmouseover instead of the CSS :hover ( It doesn't fit my situation.)

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

maxd

Add To Favorites

Follow

Total Points: 568

Total Questions: 100

Total Answers: 101

Location: Serbia

Member since Tue, Jul 26, 2022

2 Years ago

answered 13 Years ago zahrafrancisr · Accepted Answer

You can do it with some Voodoo magic:

var head = document.getElementsByTagName('head')[0];

var style = document.createElement('style');

var declarations = document.createTextNode('selector:pseudo { property: value }');



style.type = 'text/css';



if (style.styleSheet) {

  style.styleSheet.cssText = declarations.nodeValue;

} else {

  style.appendChild(declarations);

}



head.appendChild(style);

Not exactly what you needed, but you can tweak it and make a fancy function out of it if you want.