Colour changes of a table cell when mouse travels over it

Please find below an exhert of one of my HTML programs:

<table bgcolor="#0047D5" bordercolor="#BOFFFF" border="5" cellspacing="5" cellpadding"5">            
<tr>
<a href="index.html" target="_top"><td align="center"><font color="YELLOW">Homepage</font></td></a></tr>
</table>

I know that I need to use onMouseover and onMouseout to make this cell change when the mouse is placed over it but I can't work out how.

How do I attach an explanation to what the button does when the mouse goes over it.

Thanks very much in advance.

Simon Wallace
SIMONWALLACEAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

oubelkasCommented:
Button does not support the onMouseover nor the onMouseout event handler. A possible solution is using an image instead of a button. Then you can add the alt property (hint box) which displays the text you want.

e.g.

<input type="image" src="myimage.gif" alt="this text will be shown after hovering for a few secs">

So you could use a button like image for this. You can use the onClick event handler or other event handlers with this of course.

Joseph

0
dspletsCommented:
In Netscape it's not possible!  The following script will solve your two problems.

1. The information when you move your cursor over an hyperlink can you show with the title-attribute.

2. The text changing when you move the cursor over it cann you solve with a little bit CSS and javascript.

<html>

<head>
<style>
..red {color:red}
..green {color:green}
</style>

<script language="javascript">
function change(test)
{test.className="red"}

function changeaf(test)
{test.className="green"}
</script>

<title>New Page 1</title>
</head>

<body>
<table bgcolor="#0047D5" bordercolor="#BOFFFF" border="5" cellspacing="5" cellpadding"5">
<tr>
<td align="center"><a href="index.html" target="_top" name="link" title="click here" class="green" onmouseover="javascript:change(this)" onmouseout="javascript:changeaf(this)" >Homepage</a></td></tr>
</table>
</body>

</html>

Danny
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
HTML

From novice to tech pro — start learning today.