Log in

View Full Version : Mouse Over on a Web Link


andy8828
08-11-2008, 09:22 PM
Hi,

I am working on a web page. It has 2 navigation links. The web link is only working on Internet Explorer. It doesn't work on Firefox or Opera.

The link is inside the table. When I click on the mouse over box, the link goes to a web site. I want to make all the cells are clickable.



<table border="0" width="0" cellspacing="0" cellpadding="0" bgcolor="#ffffff">
<tr align="left">
<a href="http://www.google.com" target=_blank><td width="135" height="21" align="left" valign="middle" colspan="2" bgcolor="#f0f0f0" class="moutBtn" onmouseover="this.className='moverBtn';" onmouseout="this.className='moutBtn';"> <FONT COLOR=RED>Google</FONT>
</td></a>
</tr>

<tr align="left">
<a href="http://www.yahoo.com" target=_blank><td width="135" height="21" align="left" valign="middle" colspan="2" bgcolor="#f0f0f0" class="moutBtn" onmouseover="this.className='moverBtn';" onmouseout="this.className='moutBtn';"> Yahoo
</td></a>
</tr>
</table>


Here is the testing web page at:

http://www.uswebcity.com/temp/testing/

Can someone tell me how to change the code and fix it? So it can work on IE, Firefox and Opera. Thank you.

Andy
www.USWebCity.com
TheJoshMan
08-12-2008, 12:03 AM
There is a MUCH easier way of doing what you're trying to accomplish by using CSS and plain HTML...

Try this...


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<style type="text/css">
.links ul li{
list-style-type:none;
display:block;
}
.links a, .links a:link, .links a:active, .links a:visited {
color:#858585;
background:transparent;
width:135px;
height:20px;
font-size:13px;
font-family:arial;
font-weight:normal;
text-decoration:none;
padding-left:5px;
}
.links a:hover {
border:1px solid #999999;
color:#fff00;
background:#f0f0f0;
}
</style>
</HEAD>

<BODY>
<div class="links">
<ul>
<li><a href="#">Google</a></li>
<li><a href="#">Yahoo</a></li>
</ul>
</div>
</BODY>
</HTML>