<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
<style type="text/css">
#tabs {
width:auto;
}
#tabs td {
float:left;
padding:0 0 0 9px;
border-bottom:1px solid black;
}
#tabs a {
color:#333;
float:none;
}
#tabs a:hover {
color:#333;
}
</style>
<script language="javascript">
function toggle(targetTd)
{
tabsObj = document.getElementById("tabRow");
for (i=0; i<tabsObj.childNodes.length; i++)
{
if (tabsObj.childNodes[i].id == targetTd)
{
tabsObj.childNodes[i].style.borderBottomWidth =
"1px";
document.getElementById(tabsObj.childNodes[i].id + "details").style.display =
"";
}
else if (tabsObj.childNodes[i].style)
{
tabsObj.childNodes[i].style.borderWidth = "0";
if
(document.getElementById(tabsObj.childNodes[i].id + "details"))
document.getElementById(tabsObj.childNodes[i].id + "details").style.display =
"none";
}
}
}
</script>
</head>
<body>
<table width="100%" cellpadding="0" cellspacing="0" id="tabs" border="1"> <tr
id="tabRow">
<td id="tab1"><a onclick="toggle(this.parentNode.id)">tab1</a></td>
<td id="tab2"><a onclick="toggle(this.parentNode.id)">tab2</a></td>
</tr>
</table>
<span id="tab1details" style="display: none">
<br /><br />Tab1 details
</span>
<span id="tab2details" style="display: none">
<br /><br /> Tab2 details
</span>
</body>
</html>
Incase somesort of spam filter got my off-line reply.
--------------
Ian Skinner
Web Programmer
BloodSource
www.BloodSource.org
Sacramento, CA
"C code. C code run. Run code run. Please!"
- Cynthia Dunning
....-----Original Message-----
....From: Sam [mailto:[EMAIL PROTECTED]
....Sent: Friday, April 08, 2005 11:01 AM
....To: CF-Community
....Subject: need some dhtml help
....
....I need to make the tab underline go away when clicked but can't figure
....out how to do it. Any help would be greatly appreciated.
....
....code:
....
.... <style type="text/css">
.... #tabs {
.... width:auto;
.... }
.... #tabs td {
.... float:left;
.... padding:0 0 0 9px;
.... }
.... #tabs a {
.... color:#333;
.... border-bottom:1px solid;
.... float:none;
.... }
.... #tabs a:hover {
.... color:#333;
.... }
.... </style>
....<script language="javascript">
.... function toggle(targetId, targetTd) {
.... target = document.all(targetId);
.... target2 = document.all(targetTd);
.... if (target.style.display == "none"){
.... target.style.display="";
.... target2.style="border-bottom:0px;";
.... } else {
.... target.style.display="none";
.... }
.... }
....</script>
....<table width="100%" cellpadding="0" cellspacing="0" id="tabs" border="0">
....<tr>
.... <td id="tab1"><a href="javascript:toggle('tab1details',
....'tab1')">tab1</a></td>
.... <td id="tab2"><a href="javascript:toggle('tab2details',
....'nav_notes')">tab2</a></td>
....</tr>
....</table>
....<span id="tab1details" style="display: none">
.... <br /><br />Tab1 details
....</span>
....<span id="tab2details" style="display: none">
.... <br /><br /> Tab2 details
....</span>
....
....
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Find out how CFTicket can increase your company's customer support
efficiency by 100%
http://www.houseoffusion.com/banners/view.cfm?bannerid=49
Message: http://www.houseoffusion.com/lists.cfm/link=i:5:153211
Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/5
Subscription: http://www.houseoffusion.com/lists.cfm/link=s:5
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.5
Donations & Support: http://www.houseoffusion.com/tiny.cfm/54