4 replies [Last post]
joe castro
Offline
newbie
Last seen: 15 years 39 weeks ago
Joined: 2003-10-16
Posts: 1
Points: 0

Hello everyone - this is my question - I want to change the background color of a td when I mousover the td ( I can do that bit) BUT I also want to change the text color of the text inside the td at the same time! - this must be really simple just a matter of referencing the text style sheet at the same time -

any help would be really appreciated - I know this is simple - please dont laugh at me for asking such a simple question :oops: - thanks

dJomp
dJomp's picture
Offline
Enthusiast
Last seen: 3 years 24 weeks ago
Joined: 2003-03-23
Posts: 422
Points: 0

change td AND text color when mouseover only td??

Can we see how you're doing the first bit?

You know you're a geek when you try to shoo a fly away from the monitor with your cursor.

procywolfy
Offline
Regular
Last seen: 16 years 1 day ago
Joined: 2003-07-21
Posts: 21
Points: 0

change td AND text color when mouseover only td??

Joey (can I call you Joey?),

It's really easy. Just go to wherever you declared the hover state for the background and add this:

color: #ffc;

You can replace #ffc with whatever color you want. Smile

So, it may look like this:

a {
background-color: #fff;
color: #000;
}

a:hover {
background-color: #ddd;
color: #ffc;
}

Don't forget, it probably wont be just " a { " because you want it to change the color for the td, not just link text Tongue
I hope that's what you were after. Smile

yostar
yostar's picture
Offline
Regular
Toronto, Ontario, Canada
Last seen: 12 years 15 weeks ago
Toronto, Ontario, Canada
Timezone: GMT-4
Joined: 2003-10-17
Posts: 18
Points: 0

change td AND text color when mouseover only td??

I almost posted the exact same question right now.
I currently do the effect as such:

<td onMouseOver="this.style.background='blue'" onMouseOut="this.style.background='white'">

but i'm also trying to do it stricly with CSS.

setting up my css file like this didn't work:

.className{background-color: white}
td:hover.className{background-color: blue}

any ideas?? :?

Yoav Schwartz
YMS Dynamics

dJomp
dJomp's picture
Offline
Enthusiast
Last seen: 3 years 24 weeks ago
Joined: 2003-03-23
Posts: 422
Points: 0

change td AND text color when mouseover only td??

Yeah the :hover only works on A elements, so the CSS one won't work... AFAIK javascript is the way to go to create that effect.

Actually I think you can use javascript to change the class instead of just the background colour... that makes it a bit more css-esque! Can't remember how, search the forums, I'm sure it's in here somewhere...

You know you're a geek when you try to shoo a fly away from the monitor with your cursor.