Changing Paragraph Color on Hover in IE

[squidco]

I have some paragraphs on a page that I'd like have change color when
the mouse is hovering over them.

This declaration works great in Firefox and Safari, but doesn't do
anything in IE.

p:hover.review
{
color: #FFCC00;
padding: 0px;
margin: 10px;
}
....
<p class="review">my paragraph and stuph</p>
I've searched for an IE technique to change the text color without luck
- does anyone know how I could implement it?

Thanks,
philz

[Arctic Fidelity]

squidco <za*****@squidcoRemoveMe.com> wrote in news:040420051931058327%
za*****@squidcoRemoveMe.com:

p:hover.review

Unfortunately, IE does not support hover on any elements other than the
good ole' anchor tags.

There is a special htc hover file which bridges this gap. There is a
lot of information online about it.

<http://www.xs4all.nl/~peterned/csshover.html>

--
Arctic Fidelity <sp**@sacrificumdeo.net>
<http://www.sacrificumdeo.net>
"Beware of bugs in the above code; I have only proved it correct, not
tried it." -- Donald Knuth

[Martin!]

squidco wrote:

I have some paragraphs on a page that I'd like have change color when
the mouse is hovering over them.

This declaration works great in Firefox and Safari, but doesn't do
anything in IE.

p:hover.review
{
color: #FFCC00;
padding: 0px;
margin: 10px;
}
...
<p class="review">my paragraph and stuph</p>
I've searched for an IE technique to change the text color without luck
- does anyone know how I could implement it?

Thanks,
philz

in IE :hover only works on a anchor+href

[Arctic Fidelity]

Arctic Fidelity <sp**@sacrificumdeo.net> wrote in
news:Xn********************************@216.196.97 .131:

squidco <za*****@squidcoRemoveMe.com> wrote in news:040420051931058327%
za*****@squidcoRemoveMe.com:

p:hover.review

Unfortunately, IE does not support hover on any elements other than the
good ole' anchor tags.

There is a special htc hover file which bridges this gap. There is a
lot of information online about it.

<http://www.xs4all.nl/~peterned/csshover.html>

I thought I should give a bit more detail about how to implement this
in a nice and efficient manner, the information is found elsewhere, but
it's always nice to have it laid out. :-)

Basically, you get the csshover.htc behavior file for IE, and then put
a special "IE only" declaration in your web pages, so that all other
web browsers will ignore the behavior spec.

<!--[if IE]>
<style type="text/css" media="screen">
body { behavior: url(csshover.htc); }
</style>
<![endif]-->

Then you can apply a hover effect to any element in your page.

--
Arctic Fidelity <sp**@sacrificumdeo.net>
<http://www.sacrificumdeo.net>
"Beware of bugs in the above code; I have only proved it correct, not
tried it." -- Donald Knuth

[squidco]

Thanks Arctic, I went through the doc and tried to recreate the hover
behavior described, but it didn't want to work for me. Perhaps the
issue is that I'm developing on a Mac and IE behaves even differently
in our development environment... regardless, we've decided to hold off
on implementing this until we can see what the new IE CSS
implementation is like.

philz
In article <Xn********************************@216.196.97.131 >, Arctic
Fidelity <sp**@sacrificumdeo.net> wrote:

Arctic Fidelity <sp**@sacrificumdeo.net> wrote in
news:Xn********************************@216.196.97 .131:

squidco <za*****@squidcoRemoveMe.com> wrote in news:040420051931058327%
za*****@squidcoRemoveMe.com:

p:hover.review

Unfortunately, IE does not support hover on any elements other than the
good ole' anchor tags.

There is a special htc hover file which bridges this gap. There is a
lot of information online about it.

<http://www.xs4all.nl/~peterned/csshover.html>

I thought I should give a bit more detail about how to implement this
in a nice and efficient manner, the information is found elsewhere, but
it's always nice to have it laid out. :-)

Basically, you get the csshover.htc behavior file for IE, and then put
a special "IE only" declaration in your web pages, so that all other
web browsers will ignore the behavior spec.

<!--[if IE]>
<style type="text/css" media="screen">
body { behavior: url(csshover.htc); }
</style>
<![endif]-->

Then you can apply a hover effect to any element in your page.

[Arctic Fidelity]

squidco <za*****@squidcoRemoveMe.com> wrote in
news:070420051000452972%za*****@squidcoRemoveMe.co m:

Thanks Arctic, I went through the doc and tried to recreate the hover
behavior described, but it didn't want to work for me. Perhaps the
issue is that I'm developing on a Mac and IE behaves even differently
in our development environment... regardless, we've decided to hold
off on implementing this until we can see what the new IE CSS
implementation is like.

Yes, that's an unfortunate problem, as I don't think IE Mac supports
htc behavior files. Fortunately, I don't find a lot of people are using
IE Mac as much these days. I think it's becoming more phased out by
Safari. I could, of course, be misled.

--
Arctic Fidelity <sp**@sacrificumdeo.net>
<http://www.sacrificumdeo.net>
"Beware of bugs in the above code; I have only proved it correct, not
tried it." -- Donald Knuth

[mscir]

Arctic Fidelity wrote:

squidco <za*****@squidcoRemoveMe.com> wrote

Thanks Arctic, I went through the doc and tried to recreate the hover
behavior described, but it didn't want to work for me. Perhaps the
issue is that I'm developing on a Mac and IE behaves even differently
in our development environment... regardless, we've decided to hold
off on implementing this until we can see what the new IE CSS
implementation is like.

Yes, that's an unfortunate problem, as I don't think IE Mac supports
htc behavior files. Fortunately, I don't find a lot of people are using
IE Mac as much these days. I think it's becoming more phased out by
Safari. I could, of course, be misled.

Is Javascript an option? This works in my IE 6, Netscape 7.2, Firefox 1.0.1:

function setcolor(obj,color){
obj.style.color=color;
}

<p onmousemove="setcolor(this,'#FFAABB');"
onmouseout="setcolor(this,'#000000');">my paragraph and stuph</p>

[Mr.Clean]

In article <04************************@squidcoRemoveMe.com> , za*****@squidcoRemoveMe.com says...

I have some paragraphs on a page that I'd like have change color when
the mouse is hovering over them.

This declaration works great in Firefox and Safari, but doesn't do
anything in IE.

p:hover.review
{
color: #FFCC00;
padding: 0px;
margin: 10px;
}
...
<p class="review">my paragraph and stuph</p>
I've searched for an IE technique to change the text color without luck
- does anyone know how I could implement it?

Enclose it in an empty anchor tag and set text-decoration to none;

a.review
{
color: #0000;
padding: 0px;
margin: 10px;
text-decoration: none;
}

a.review:hover
{
color: #FF0000;
padding: 0px;
margin: 10px;
text-decoration: none;
}
<a href="#" class="review"><p>my paragraph and stuph</p></a>