Thread: Hyperlink table cell
Results 1 to 12 of 12
Related
-
hyperlink in table cell not working Forum: HTML Forum
Replies: 1 -
Scrollbar in a cell in a table? Forum: HTML Forum
Replies: 6 -
table cell background Forum: CSS Forum
Replies: 3 -
table - cell hyperlinking Forum: HTML Forum
Replies: 3
-
01-08-2004, 08:59 AM #1
Hyperlink table cell
Is it possible to make a table cell hyperlink to something? Let me explain. I have a form setup where, if I click on a certain word, that word fills a table cell (using CSS, DIV and javascript). However, I want the user to be able to click on that table cell to have a NEW word put in that cell. So, let's say the user clicks on the word "HELLO". Then, the table cell would contain the word "HELLO". If the user now clicks anywhere in the table cell, I want the word "HELLO" (in the cell) to change to "GOODBYE". Also, if the user was to now go back and click on the word "HELLO", I again want the table cell filled with the word "HELLO"...and so on.
Reminder: I have the "click on HELLO to fill the cell with HELLO" working fine...I just need to get the "click in cell to fill with GOODBYE" part working.
There might be a CSS solution to this, but I thought I'd start by posting here. Thanks in advance!!!
-
01-08-2004, 09:09 AM #2
I think I found the solution (Posted by QuietDean) called HyperCell...well, at least something that I can start with...I haven't tried it yet, but it looks like it might work:
Code:<table name="badger"> <tr> <td class="row1" width="100%" style="cursor:hand; padding: 30px; border: 1px solid black;" onclick="window.location.href='linked_page.html'">THIS IS CONTENT</td> </tr> </table>
-
01-08-2004, 01:55 PM #3
If its got the word 'badger' in it, its usually by me
If one of our members helps you, please click theicon to add to their reputation!
No support via email or private message - use the forums!
Before you ask, have you Searched?
-
01-08-2004, 02:55 PM #4
Originally Posted by QuietDean
-
01-08-2004, 03:08 PM #5
no problem. Glad its working.
If one of our members helps you, please click theicon to add to their reputation!
No support via email or private message - use the forums!
Before you ask, have you Searched?
-
06-27-2004, 01:04 AM #6
target
Is it possible if Hypercells target frames...?
-
06-27-2004, 05:23 AM #7
Yes, it is. In the 'onClick' code, replace 'window' with 'parent.framename'
So if my frame is called 'MAIN' then the onlick is
Code:parent.MAIN.location.href='http://www.quietdean.com'
If one of our members helps you, please click theicon to add to their reputation!
No support via email or private message - use the forums!
Before you ask, have you Searched?
-
07-01-2004, 02:22 AM #8
-
07-30-2004, 09:38 PM #9
Is there any way to get this same effect without using Javascript? Id like to make my cells hyperlinked but do not want to use Java. Any ideas?
Thanks!
Bryan
-
07-31-2004, 06:34 AM #10bald headed old fart
Status- Offline
Join Date- Aug 2003
Location- chertsey, a small town 25 miles south west of london, england.
Posts- 739
Hi there boroarke,
and a warm welcome to these forums
Is there any way to get this same effect without using Javascript?
Code:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>javascript free td link</title> <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" /> <style type="text/css"> /*<![CDATA[*/ body { background:#9900aa; } #container { position:absolute; left:50%; top:50%; width:200px; margin:-25px 0 0 -100px; } #cell { width:200px; height:50px; border:solid 1px #000000; } a#goog { display:block; width:200px; height:50px; background:#000000; text-align:center; text-decoration:none; padding-top:5px; font-family:arial; font-size:16px; color:#ffffff; } a#goog:hover { background:#ffffff; color:#000000; } /*//]]>*/ </style> </head> <body> <div id="container"> <table><tr> <td id="cell"><a id="goog"href="http://www.google.com"> click the whole cell for google</a></td> </tr></table> </div> </body> </html>
-
08-26-2004, 05:20 PM #11
A small modification to coothead's css will make the hover area much more flexible.
Code:#cell { width:200px; border:solid 1px #000000; }
Code:a#goog { display:block; width:100%; height:100%; background:#000000; text-align:center; text-decoration:none; padding-top:5px; font-family:arial; font-size:16px; color:#ffffff; }
So the new example would be:
Code:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>javascript free td link</title> <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" /> <style type="text/css"> /*<![CDATA[*/ body { background:#9900aa; } #container { position:absolute; left:50%; top:50%; width:200px; margin:-25px 0 0 -100px; } #cell { width:200px; border:solid 1px #000000; } a#goog { display:block; width:100%; height:100%; background:#000000; text-align:center; text-decoration:none; padding-top:5px; font-family:arial; font-size:16px; color:#ffffff; } a#goog:hover { background:#ffffff; color:#000000; } /*//]]>*/ </style> </head> <body> <div id="container"> <table> <tr> <td id="cell"><a id="goog"href="http://www.google.com"> click the whole cell for google<br /><br />which can now grow...<br /><br />even across multiple line breaks<br /><br />not that you should use tons of line breaks, but paragraphs aren't allowed inside links</a></td> </tr> </table> </div> </body> </html>
-
08-26-2004, 10:24 PM #12
Originally Posted by J-Man
If you use FrontPage,I think you can easily do all these. In the normal mode when you create a table,just right click on the table cell where you want to insert hyperlink. You can edit its properties also.
Cloudjiffy- PaaS for Developers
10-05-2020, 12:30 AM in Web Hosting Forum