 |
| HTML Code Clinic Do you have some HTML code you'd like to share and get suggestions from others for tweaking or improving it? This discussion is the place. |
Welcome to the p2p.wrox.com Forums.
You are currently viewing the HTML Code Clinic section of the Wrox Programmer to Programmer discussions. This is a community of software programmers and website developers including Wrox book authors and readers. New member registration was closed in 2019. New posts were shut off and the site was archived into this static format as of October 1, 2020. If you require technical support for a Wrox book please contact http://hub.wiley.com
|
|
|
|
September 2nd, 2005, 07:35 AM
|
|
Friend of Wrox
|
|
Join Date: Jun 2003
Posts: 440
Thanks: 0
Thanked 0 Times in 0 Posts
|
|
You can try something like this...
Code:
<html>
<head>
<style>
table { font-family:verdana; font-size:8pt; }
td.contents { border:solid 1px #dddddd; padding:5px; }
td.button { border:outset 1px #bbbbbb; padding:5px; cursor:pointer; cursor:hand; }
ul { margin:0px; margin-left:20px; padding-left:0px; }
</style>
<script language=javascript>
function toggle(sectionId)
{
var color01 = "#555555";
var color01rgb = "rgb(85, 85, 85)";
var color02 = "#eeeeee";
var color02rgb = "rgb(238, 238, 238)";
var field;
field = document.getElementById(sectionId);
if(field != null)
{
field.style.backgroundColor =
(field.style.backgroundColor == color01 || field.style.backgroundColor == color01rgb)? color02 : color01;
field.style.color =
(field.style.color == color01 || field.style.color == color01rgb)? color02 : color01;
}
}
</script>
</head>
<body>
<table border="0" cellspacing="5">
<tr>
<td class="contents" colspan="2">
[list]
<li>item 01</li>
<li>item 02</li>
</ul>
</td>
</tr>
<tr>
<td id="b1"
class="button"
style="color:#555555; background-color:#eeeeee;"
onmouseover="toggle('b1'); return false;"
onmouseout="toggle('b1'); return false;">button 01</td>
<td id="b2"
class="button"
style="color:#555555; background-color:#eeeeee;"
onmouseover="toggle('b2'); return false;"
onmouseout="toggle('b2'); return false;">button 01</td>
</tr>
</table>
</body>
</html>
But why don't you use the ordinary button (<input type="button" />)?
Jacob.
|
|
September 2nd, 2005, 08:29 AM
|
|
Friend of Wrox
|
|
Join Date: Jun 2003
Posts: 425
Thanks: 0
Thanked 3 Times in 3 Posts
|
|
LOL! Why do you have to do everything with a table, crmpicco? 
I could be wrong,just guessing here, but I suspect those cells will contain links. So style the links to look like buttons and they don't have to be in a table. :)
http://yupapa.com
|
|
September 12th, 2005, 03:42 PM
|
|
Friend of Wrox
|
|
Join Date: Jun 2003
Posts: 425
Thanks: 0
Thanked 3 Times in 3 Posts
|
|
|
|
September 13th, 2005, 08:03 AM
|
|
Friend of Wrox
|
|
Join Date: Jan 2005
Posts: 1,525
Thanks: 0
Thanked 0 Times in 0 Posts
|
|
|
|
September 13th, 2005, 03:21 PM
|
|
Friend of Wrox
|
|
Join Date: Jun 2003
Posts: 425
Thanks: 0
Thanked 3 Times in 3 Posts
|
|
|
|
September 13th, 2005, 03:56 PM
|
|
Friend of Wrox
|
|
Join Date: Jun 2003
Posts: 440
Thanks: 0
Thanked 0 Times in 0 Posts
|
|
try 'view source' on meow's page ;) Jacob.
|
|
September 16th, 2005, 12:34 AM
|
|
Friend of Wrox
|
|
Join Date: Jun 2003
Posts: 425
Thanks: 0
Thanked 3 Times in 3 Posts
|
|
Sure does. So do these. :)
Which one is your table? 
--
http://yupapa.com
|
|
|
:D