Using :hover without a text link

**awestmoreland** · Sep 19, 2003 04:03

I feel a bit of a spanner asking this question as I feel like I should know the answer. However I've not found the answer after searching the forum:

Is it possible to use :hover on anything other than a text link?

I see examples of using :hover all over but they're always like this: td a:hover{...}

Although this will change the appearance of the table cell, it relies on hovering over a text link contained within it rather than simply the td itself.

How do I change the following css so that hovering over the span will change the span's background?

.myspan{
background: url("red_flower.gif" );
}
.myspan:hover{
background: url("blue_flower.gif" );
}

<span class="myspan">Text over a changing background</span>

Thanks,

Andy

**xhtmlcoder** · Sep 19, 2003 04:03

Basically you have to use the anchor to get the :hover pseudo to work if you plan a CSS only approach with the 'background-image' though of course the anchor doesn't have to point anywhere.

**awestmoreland** · Sep 19, 2003 04:21

You're right, that should have been 'background-image' and in my page that's what I have. I typed the code into my message wrongly.

However, that isn't what's causing my problem

Thanks,

Andy

**blufive** · Sep 19, 2003 10:57

Depends whether you want it to work in IE or not. The following trivial example works perfectly in recent versions of both Mozilla and Opera, but not IE, which only supports :hover on anchors.

Code:

<html><head><title>Hover</title><style>
h1 { color: blue; }
h1:hover { color: red; }
</style></head><body>
<h1>MouseOver Me!</h1>
</body></html>

**awestmoreland** · Sep 20, 2003 13:00

Ah, that explains it then.
It's only for something which will be used on IE and so I was only testing it on that. Looks like I'll just have to use Javascript. I was trying to do it properly by simply using CSS, but again I have to come to the conclusion that CSS still isn't up to the demands of serious web development.

Thanks for the help,

Andy

**Travis** · Sep 20, 2003 13:19

CSS is up to it, its support by IE isn't.

**awestmoreland** · Sep 20, 2003 13:25

Originally Posted by travis

CSS is up to it, its support by IE isn't.

Well it amounts to the same thing because it can't be relied on in all browsers.

Enough with the badgers already!

Andy

**vgarcia** · Sep 20, 2003 17:03

Originally Posted by awestmoreland

Well it amounts to the same thing because it can't be relied on in all browsers.

Not really. Actually, you have ONE COMPANY holding up the future of development in CSS. That is not the same as a flawed standard. WAP is a flawed standard; IE is a flawed browser. I understand your frustration, but it's not CSS's fault.

**awestmoreland** · Sep 20, 2003 17:17

Fair enough. Point taken.
I've still to see a site written using only CSS that impresses me however. I'm sure that the code looks great, but generally you can spot a CSS-only page a mile off because it looks "a bit naff"

Andy

User Tag List

Thread: Using :hover without a text link

Thread Tools

Display

Using :hover without a text link

Bookmarks

Bookmarks

Posting Permissions