homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

Change a TD Background-color with JavaScript?
How to do it with onMouseOver?

10+ Year Member

Msg#: 241 posted 12:53 pm on Dec 10, 2002 (gmt 0)

Good morning,

I've a table with some different background-coloured cells (td) whose colour I want to change to white when the mouse is over and then revert each one to its previous colour when mouse is out.

I think I can do that with CSS, Javascript and classes, but I'd like to do it "the proper way", that is: for Netscape 6 and Explorer 5 and upper. I don't have any clue of how to manipulate the backround-color of a given class to do that: onMouseOver=....?

Could anybody lend me a helping hand or put me in the right direction.

Thanks a lot in advance


PS. I try to be xhmtl 1.1 compliant (and up to now, I've been succesful)



10+ Year Member

Msg#: 241 posted 1:32 pm on Dec 10, 2002 (gmt 0)

IS this what you mean ...

<td width="20%" bgcolor="#6699ff" valign="top" onMouseover="this.bgColor='#e7efff'"onMouseout="this.bgColor='#6699ff'" align="center"><font size="2"><a style="font-family: tahoma; font-size: 10pt; color: #000000; text-decoration: none" title="Widgets" href="example.htm" target="main">Buy a Widget</a></font></td>

Or am I missing the point. :)


10+ Year Member

Msg#: 241 posted 2:11 pm on Dec 10, 2002 (gmt 0)

Well, somehow it is but it's not that: It's a table with 16 cells. Each one has one colour. Some of them can be printed in a printing press and some, cannot.

The idea is that when the user passes the mouse over a non-printable colour, all non printable colours turn white, and when the mouse goes "out", they revert to their previous colour. So the user can learn the difference between them.

As I said, I think this can be achieved altering a class attributes. But I just know how to change an element with an "id='joe'" not a "class='joe'".

Any idea, please :)

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved