I have a navbar with text links in them, we couldnt use images as the site is image intensive and it slows down loading. Anyway, I want to make the whole cell that the link resides in a link, so that it looks like a button and reacts like a button. here is the page where you will see the existing links <!-- m --><a class="postlink" href="http://www.placerguide.com/index2.cfm">http://www.placerguide.com/index2.cfm</a><!-- m --> <br />
the navbar on the left side is the one i am refering to. I have had many people try to click on the cell thinking it was a button, instead of clicking on the text.<br />
Does anyone know a trick to this?<!--content-->so that it looks like a button and reacts like a button <br />
<br />
A button is an image that can be coded to be displayed in the hyperlinked cell,, but you said that you do not want images
<!--content-->to an end user the navbar on that page looks like a bunch of buttons. so i want it to act like an image button would, i want the whole cell to be clickable. Do you know how to do that?<!--content-->on another website where you have seen this effect so we can take a look at it?<!--content-->I cant really think of one, this may be, i cant tell <!-- m --><a class="postlink" href="http://www.google.com/">http://www.google.com/</a><!-- m --><!--content-->You can do this with some CSS.<br />
<br />
You would define the size of the A/Anchors in style form so that it covers the full size of the cell. This could be done as a percentage or pixel unit.<br />
Something like this:<br />
<br />
<a style="width: 100%;" href=http://www.htmlforums.com/archive/index.php/"#">link</a><br />
<br />
For pixels just replace with px instead of % if you want to control the size a bit more.<!--content-->How about using table cells with background color so they look like buttons, use CSS filter options and stuff to make them look cooler (opactiy, emboss, etc) - and link them. you can also use CSS hover and if necessary, some javascript to make them animate at mouse over.<br />
<br />
for the table cells you probably have to use CSS to control height, width, background color, etc.<!--content-->Isnt that a bit overkill? Once can set a simple image as a background then use my suggested css. Not everything has to be rollover.<br />
<br />
Anyway I think the point was to have the white space around the link subject to the click as well which the above css covers.<!--content-->I'm kind of a blonde when it comes to CCS, so i will have to play with it ( I say while gritting my teeth). If there are other suggestions (or someone to walk me through it), I am still open, but I will definitely try these!<br />
Thank you!<!--content-->You might be blonde but that css solution is as about as easy as it gets. Try it on one link and it will work for sure.<!--content-->"I'm Feeling Lucky" which looks like a button with height and definition, it is a form function like a submit button.<br />
<br />
<img width=1 height=1 alt=""></td></tr></table><br><form action="/search" name=f><table cellspacing=0 cellpadding=0><tr><td width=75> </td><td align=center><input type=hidden name=hl value=en><span id=hf></span><input type=hidden name=ie value="UTF-8"><input type=hidden name=oe value="UTF-8"><input maxLength=256 size=55 name=q value=""><br><input type=submit value="Google Search" name=btnG><input type=submit value="I'm Feeling Lucky" name=btnI></td><!--content-->You guys rock! if i can make it work, WOW. I am testing for browser compatibilty now<!--content-->entimp-<br />
ok, it worked when i just added the code to the body, but should i be using a style sheet in the header? It isnt working in netscape.<!--content-->http://www.corkboard.biz/ebay/test%20link.html<!--content-->you might have to use javascript and use onmouseover on the cell. that will make it work in most browsers. for fast fix you can make the link go around the cell but it may not work in NS<!--content-->scoutt-<br />
can you show me an example code of what you just described?<!--content-->you can do somethign like this, also you can add somemore so it looks like a link instead, like change the cursor or something.<br />
<br />
<td valign="top" align="left" onclick="location.href='http://www.placerguide.com/ae/'"><br />
<a title="Arts and Entertainment" class="leftnav" target="_parent" href=http://www.htmlforums.com/archive/index.php/"http://www.placerguide.com/ae/">Arts & Entertainment</a></td><!--content-->you can do this too, but it only works in IE<br />
<br />
onmouseover="this.style.cursor='hand'" onmouseout="this.style.cursor=''"<br />
<br />
put that in the cell<!--content-->Thank you everyone<!--content-->
the navbar on the left side is the one i am refering to. I have had many people try to click on the cell thinking it was a button, instead of clicking on the text.<br />
Does anyone know a trick to this?<!--content-->so that it looks like a button and reacts like a button <br />
<br />
A button is an image that can be coded to be displayed in the hyperlinked cell,, but you said that you do not want images
<!--content-->to an end user the navbar on that page looks like a bunch of buttons. so i want it to act like an image button would, i want the whole cell to be clickable. Do you know how to do that?<!--content-->on another website where you have seen this effect so we can take a look at it?<!--content-->I cant really think of one, this may be, i cant tell <!-- m --><a class="postlink" href="http://www.google.com/">http://www.google.com/</a><!-- m --><!--content-->You can do this with some CSS.<br /><br />
You would define the size of the A/Anchors in style form so that it covers the full size of the cell. This could be done as a percentage or pixel unit.<br />
Something like this:<br />
<br />
<a style="width: 100%;" href=http://www.htmlforums.com/archive/index.php/"#">link</a><br />
<br />
For pixels just replace with px instead of % if you want to control the size a bit more.<!--content-->How about using table cells with background color so they look like buttons, use CSS filter options and stuff to make them look cooler (opactiy, emboss, etc) - and link them. you can also use CSS hover and if necessary, some javascript to make them animate at mouse over.<br />
<br />
for the table cells you probably have to use CSS to control height, width, background color, etc.<!--content-->Isnt that a bit overkill? Once can set a simple image as a background then use my suggested css. Not everything has to be rollover.<br />
<br />
Anyway I think the point was to have the white space around the link subject to the click as well which the above css covers.<!--content-->I'm kind of a blonde when it comes to CCS, so i will have to play with it ( I say while gritting my teeth). If there are other suggestions (or someone to walk me through it), I am still open, but I will definitely try these!<br />
Thank you!<!--content-->You might be blonde but that css solution is as about as easy as it gets. Try it on one link and it will work for sure.<!--content-->"I'm Feeling Lucky" which looks like a button with height and definition, it is a form function like a submit button.<br />
<br />
<img width=1 height=1 alt=""></td></tr></table><br><form action="/search" name=f><table cellspacing=0 cellpadding=0><tr><td width=75> </td><td align=center><input type=hidden name=hl value=en><span id=hf></span><input type=hidden name=ie value="UTF-8"><input type=hidden name=oe value="UTF-8"><input maxLength=256 size=55 name=q value=""><br><input type=submit value="Google Search" name=btnG><input type=submit value="I'm Feeling Lucky" name=btnI></td><!--content-->You guys rock! if i can make it work, WOW. I am testing for browser compatibilty now<!--content-->entimp-<br />
ok, it worked when i just added the code to the body, but should i be using a style sheet in the header? It isnt working in netscape.<!--content-->http://www.corkboard.biz/ebay/test%20link.html<!--content-->you might have to use javascript and use onmouseover on the cell. that will make it work in most browsers. for fast fix you can make the link go around the cell but it may not work in NS<!--content-->scoutt-<br />
can you show me an example code of what you just described?<!--content-->you can do somethign like this, also you can add somemore so it looks like a link instead, like change the cursor or something.<br />
<br />
<td valign="top" align="left" onclick="location.href='http://www.placerguide.com/ae/'"><br />
<a title="Arts and Entertainment" class="leftnav" target="_parent" href=http://www.htmlforums.com/archive/index.php/"http://www.placerguide.com/ae/">Arts & Entertainment</a></td><!--content-->you can do this too, but it only works in IE<br />
<br />
onmouseover="this.style.cursor='hand'" onmouseout="this.style.cursor=''"<br />
<br />
put that in the cell<!--content-->Thank you everyone<!--content-->