Hi all
does anyone know how add a link to a table cell?? not the content just the table cell. I do need the style to be an inline too!!
I cant for the life of me think how I can do it.
its a real urgent one as well
cheers for any help
max
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Strictly speaking, you can’t do this. There are two ways around it,
though. The first will work if your link is the only content in the
table cell: use css to make the a (link) a block tag, and give it
dimensions that fill your table cell. The second involves JavaScript:
set a click observer on the cell and set it to redirect to the desired
URL.
I’ll write more later when my net is back up and I’m not pecking away
at mi iPhone.
Walter
On Jan 21, 2009, at 8:27 AM, “max” email@hidden wrote:
Hi all
does anyone know how add a link to a table cell?? not the content
just the table cell. I do need the style to be an inline too!!
I cant for the life of me think how I can do it.
its a real urgent one as well
cheers for any helpmax
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
hi walter
don’t worry about rushing I have got around the problem for now
speak soon max
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Longer explanation as promised.
###CSS:
An A tag (anchor, href, link) is an inline tag by default, and cannot
wrap around a block-level tag like a table cell. If your table cell
contains nothing except the text of your link:
<td>
<p class="fw_lp"><a href="foo/bar">baz</a></p>
</td>
…then you can make the link appear to fill the cell by creating a
style for a block-level link.
Make a new style. In the Tag field, enter ‘a.block’ (without the
quotes), tab into the Name field and delete whatever is there, then
tab back out to make sure it “sticks” that way. Click on the Extended
button and then New, and in the Name and Value fields, enter ‘display’
and ‘block’, respectively (again, without the quotes). Okay that
dialog, then press New again and enter ‘padding’ and ‘12px’, and okay
that. (This is just a test, you can fiddle with this amount, or set it
to be different on top and bottom than left and right – whatever you
need – later.) Okay out of the stack of dialogs.
Make a second style in the exact same manner as above, tagging it
‘a.block:hover’. In the Character (+) drop-down, select Background
Color, and set something pretty.
Finally, make sure your table is set to Height Can Shrink in the
Inspector, and highlight your entire link. Open the Hyperlink dialog,
and click on the Extended button. Add a new Name/Value pair of ‘class’
and ‘block’.
Preview. The link should affect the entire table cell (as long as
there is no padding inside the cell to push it in from the edges) and
the entire cell should change color when you mouse over it.
There’s a way to do this in JavaScript, and I started writing it out,
but it’s taking too long and I still need to test it. If I find time
later I will wrap it up for you. Using JS, you can set this effect to
happen on table cells that contain more than just a link.
Walter
On Jan 21, 2009, at 9:15 AM, Walter Lee Davis wrote:
I’ll write more later when my net is back up and I’m not pecking
away at mi iPhone.
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
###JavaScript:
If your link is not alone in the table cell, but you want the entire
cell to respond as if it was a link, you’ll need to simulate the
effect with JavaScript, because IE cannot understand the :hover pseudo-
class on anything except a link.
Apply the Protaculous Action to the page, and select prototype-packed
from the Library picker.
Create a new style as above tagged ‘td.hover’, and give it the
Background Color property and nothing else.
Now your table cell can contain only one link, but may contain lots of
other text or images or whatnot. Click once on the table cell so it is
selected (gray border inside) and click on the Extend… button in the
Inspector. Click new and add ‘class’ and ‘link’ and okay out. (Never
mind that you haven’t made a CSS class called link anywhere – we’re
just using this as a way to identify the table cells that need this
behavior. If you do have a class called link in your CSS styles, pick
another name and adjust the following code to match.)
Click on the page, so nothing is selected, and then click the second
Function Body button in the Protaculous tab of the Actions palette.
Paste the following lump-o-code:
var fakeLinks = $$('td.link');
fakeLinks.each(function(elm){
elm.observe('mouseover',function(evt){
elm.addClassName('hover')
});
elm.observe('click',function(evt){
return document.location.href = elm.down('a').href;
});
document.observe('mouseover',function(evt){
var el = Event.element(evt);
if(elm != el && !el.descendantOf(elm))
elm.removeClassName('hover');
});
});
Now, when you hover over the table cell, it will change to have the
background color you want, and when you click, it will navigate to the
first link it finds in the table cell.
Walter
On Jan 21, 2009, at 11:06 AM, Walter Lee Davis wrote:
There’s a way to do this in JavaScript, and I started writing it
out, but it’s taking too long and I still need to test it. If I find
time later I will wrap it up for you. Using JS, you can set this
effect to happen on table cells that contain more than just a link.
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Max, I have an action that will pretty much do this by inserting a
little javascript, it is my ‘Cell BG Colour On Rollover’ action
although not the one that is available for download, I have a version
I use myself that has a little more code added to link the cell
onclick. If you want a copy to try and see if it suites your needs
then just let me know and I can send you it by email.
HTH
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Hi walter thanks for this that will probably work out fine
and Mike yes please could I have a look at your adjusted action too
max.izzat(at)virgin.net
cheers everyone
max
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options