Forum Moderators: not2easy

Message Too Old, No Replies

dynamically setting a hover color with js and css

how do you specify a hover color change with js and css?

         

mattbyrnes

2:48 am on Oct 9, 2007 (gmt 0)

10+ Year Member



I'm writing a script that enables users to customise the site with the colors of their choosing.

However, I'm not finding a way to specify a color for a hover, visited or hover background color using js and css.

For changing the link color, I can just use document.getElementById('some_link_id').style.color='#ffffff';

How do I enable a change in a psuedo class' color in the same way?

penders

9:30 am on Oct 9, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



In order to change the colour of the link using JavaScript when the user hovers over the link then you need to change the colour (as you are doing) from the onmouseover event of the required element, and then change it back to the 'normal' colour in the onmouseout event.

I'm not even sure you can differentiate between visited and unvisited links in JavaScript?

To set the background-color (CSS) in JavaScript you need to set the property .backgroundColor

IMHO it would be better/simpler to allow your users to generate a custom stylesheet (under program control) and not use JavaScript at all.

mattbyrnes

6:41 pm on Oct 9, 2007 (gmt 0)

10+ Year Member



Ok, onmouseover is a good idea.

They can set a color value in/with javascript and then the mouseover event can refer to that color value.

The goal is for them to be able to fiddle around with a bunch of different colors without having to submit the page to see what it will look like.

Thanks!