PDA

View Full Version : Click-able Table Cell

Candrias77
09-12-2002, 10:59 PM
Has anyone used or seen the code which makes a table cell clickable like a button or text link?

There is pleanty of ways of changing the background colour of a cell which i am using but you still need to click the actual text link within the cell to activate the link. I would like to be able to click anywhere in the cell and have it follow the link (and do the pointing finger cursor anywhere on that cell too).

If you can shed any light, it would be much appreciated.

Thanks.

-- candrias --
x_goose_x
09-12-2002, 11:21 PM
This what you want?


<td style="background-color: red; cursor: hand;" onclick="location.replace('http://www.google.com');">My Cell</td>
Candrias77
09-12-2002, 11:40 PM
Thats perfect goose, thanks.
hairynugs6382
09-12-2002, 11:58 PM
U could use this to change cell color on onclick, onmouseover, or onmouseout:

<td onclick="this.style.color='#000000'" onmouseover="this.style.color='#FFFFFF'"
onmouseout="this.style.color='#CECECE'">SOME TABLE DATA</td>
Candrias77
09-13-2002, 12:29 AM
Yeah, i already had a piece of code like what you suggested which changed the class of the cell (which was defined in an external style sheet) but it was only changing the colour of the cell. Now it also changes the cursor and activates a link onClick.

Thanks for the help from both of you, it's working well now.
ronaldb66
09-13-2002, 08:25 AM
I doubt if all or even many browsers support events for a table cell...
You could revert to using an image as link.
jkd
09-13-2002, 11:11 AM
Originally posted by ronaldb66
I doubt if all or even many browsers support events for a table cell...

IE4+/NS6+/Opera 5+?

really just leaves out NS4.
adios
09-14-2002, 02:38 AM
...stop picking on Navigator...;)

<html>
<head>
<title>untitled</title>
</head>
<body>
<div align="center">
<table width="200" border="1">
<tr>
<td width="100" height="50" bgcolor="green" onclick="alert('green')">
<ilayer><layer width="100" height="50"
onload="this.document.onclick=function(){alert('green')}">
</layer></ilayer></td>
<td width="100" bgcolor="red" onclick="alert('red')">
<ilayer><layer width="100" height="50"
onload="this.document.onclick=function(){alert('red')}">
</layer></ilayer></td>
</tr>
</table>
</div>
</body>
</html>