View Full Version : setting background from js destroys background hover effect

02-10-2007, 05:34 PM
this works fine: background and color getts changed

background:#FFFFD9;/*sort of yellow*/
color: #B90400;/*red*/

<a id = 'test' class = "mi" href="#n">aaaaaaaaaaa </a>


document.getElementById('test').style.background = 'blue'

effect from hover , on background, is gone !?
on color part still works.
it isn't browser thing, works the same on IE and FF

this, on the other hand, works as expected, does not corrupt anything

document.getElementById('test').style.color = 'blue'

test link:

thanks for replays

02-10-2007, 05:53 PM
Inline styles always override the stylesheet styles applied

add this to the css

.changed {
background-color: #0000ff;
and change the button code to something like this

<BUTTON class = "brb" ONCLICK="document.getElementById('test').className = document.getElementById('test').className + ' changed';"> destroy background hover 1</BUTTON>

should do the trick

02-10-2007, 07:14 PM
nice tip, didn't know that classes in css could be combined like that.