need help with Roll over stylesheet.

Below is a expanded content stylesheet that I'm working on, the expand style sheet works but I can't figured out how to make the link itself a blue state and red when roll over.

<p onClick="expandcontent('sc9')" style="cursor:hand; cursorointer;> How do I make this link blue with red rollover? </p>

I don't think I can use the <a href> tag </a> Please advise if you have a suggestion. Thanks.

-Ott

what link?

In this example the link will be >How do I make this link blue with red rollover?< as seen in the above example. When you roll your mouse over this it will turn the cursor into a hand and when you click on it right now it will expan to the text below with more text notice onClick="expandcontent"

So, the link I want to replicate is the >How do I make this link blue with red rollover?< I want to be able to roll over this with different color. I want to try to replicate it as though it is an a href tag. Thanks.

cant you use the :hover pseudo class to for the onhover event?

I tried but I can't get it to work. How should I use the :hover in the style code? Is it something like this?
<p onClick="expandcontent('sc9')" style="hover: color: #a00c25; cursor:hand; cursorointer;">

i don't know how to use it in the actual style of the

but you can use it at the top, in the head:

<style>
p.over:hover {

//STYLING

}
</style>

and add the class="over" to the

....

try this:

Code: Select all

<style type="text/css">
 P#test a { color:blue }
 P#test a:hover { color:red }
</style>

<p id="test">click me</p>

Thank you both benbarcardi and D3mon, both was good suggestions, but I went with D3mon which seem to work beautifully. Again, both of your comments were great. Thanks.

You can't use :hover (note the ":") as an inline style. Just take a look at the confusion:

Code: Select all

<p onClick="expandcontent('sc9')" style=":hover: color: #a00c25; cursor:hand; cursor:pointer;">

See the :hover That simply confuses many browsers. Also, you can eliminate "cursor:hand" because "pointer" and "hand" are the same. "hand" is simply an IE add-in (bad M$! )