Adding hover command to javascript in .js file

Can't add it to a line of code. Please help!

[1Lit]

After requesting help, a while back somebody kindly came up with the following code which I use in a .js file to send my visitors to a different link for each month e.g.:

months[9]="this <a onMouseOver=\"window.status='Go here to visit our September link'; return true;\" onCLick=\"location.href='http://www.septemberwebsite.com'\" title=\"September\" style=\"color: 1D418B; text-decoration: underline; cursor: hand; \"> September Site</a>";

I need to integrate it into my site which currently has the following command in the header:

<style>

A:link {color:#1D418B}
A:visited:{color:#6699FF}
A:hover {text-decoration: underline overline}
A:hover{color:red}
</style>

Unfortunately, the hover and visited commands do not seem to affect the code I have provided. I've managed to incorporate the a:link command, as you can see, but not the other style features. Is there any way of adding the a:hover and a:visited command to the script? I've put the bit that we need to add these commands to in bold. I have tried several permutations of these commands, but it doesn't seem to have any effect on the text that is displayed.

Thank you :)

[Melander]

There appear to be two separate problems, one related to your CSS and the other your javascript. Both require correction to the month[n] strings.

First, eliminate

style=\"color: 1D418B; text-decoration: underline; cursor: hand;

from month[n].

Second, eliminate

onCLick=\"location.href='http://www.septemberwebsite.com'\"

and replace with

href='http://www.septemberwebsite.com'

in month[n].

This has been checked with IE6/Win only.

My guesses as to the source of the problem are that:

setting the style attribute on the <a> element overrides the general <style> declarations in the head, since it is more specific.

you are using an "onclick" action to emulate a link rather than setting the href attribute to make the <a> a link. IE (at least) does not view the <a> element as a link to which the "a:" psuedoclass styling should be applied.

As my grasp of CSS and javascript theory are tenuous at best, I trust the better-informed among you will be kind enough to correct the above.

Regards,

[moonbiter]

Melander is correct. Declaring the color property directly on the element overrides the property definition in the

style

element. That's what the "Cascading" in Cascading Style Sheets (aka CSS) is all about.

He/she is right about the onclick too. Unless you have something funky going on in the code that you didn't show us, doing

onclick="location.href='foo.htm'"

is completely unnecessary.