it.rss24h.com

Solving technology problems

Home » Programming

Problem showing / hiding layers…

July 30th, 2009 | xumi | 0 Comments »

Question:

Here’s my code:

<DIV ID=”program”>
<script language=”javascript”>
var curAd=1;
function swapAd(inpt){
if(curAd!=inpt){
document.getElementById(‘adtab’+inpt).className=”selectedtab”;
document.getElementById(‘adtab’+curAd).className=”tab”;
document.getElementById(‘ad’+inpt).style.display=’block’;
document.getElementById(‘ad’+curAd).style.display=’none’;
curAd=inpt;
}
}
</script>
<DIV ID=”programnav”>
<table cellspacing=”0″ cellpadding=”0″>
<tr>
<td id=”adtab2″ onclick=”swapAd(2)”><li><a href=”#”>Presentation</a></td>
<td id=”adtab3″ onclick=”swapAd(3)”><li><a href=”#”>Treatment Options</a></td>
<td id=”adtab4″ onclick=”swapAd(4)”><li><a href=”#”>Post-Tx Surveillance</a></li></td>
</tr>
</table>
</DIV>
<div style=”display: block; background: #FBDC9B; height:250px;margin-top:0;padding:10px 10px 10px 10px;” id=”ad1″>
<p>To review the case study details, click on the tabs above.</p>
</DIV>
<div style=”display: none; background: #FBDC9B; height:250px;margin-top:0;padding:10px 10px 10px 10px;” id=”ad2″>
<p>60 Year Old Healthy Male</p>
<p>No Comorbidities</p>
<p>T2c, Gleason 4+3,7/12</p>
<p>Cores Positive (Bilateral)</p>
<p>PSA=10, PSA 1r ago=4</p>
<p>Bone Scan -NEG</p>
</DIV>
<div style=”display: none; background: #FBDC9B; height:250px;margin-top:0;padding:10px 10px 10px 10px;” id=”ad3″>
<p>Screen 2</p>
<p>RRP with Bilateral LND Performed.</p>
<p>Pathology: Gleason 4+4, ECE Present; Margins, SV & Nodes are Negative.</p>
<p>Stage pT3a N-</p>
</DIV>
<div style=”display: none; background: #FBDC9B; height:250px;margin-top:0;padding:10px 10px 10px 10px;” id=”ad4″>
<p>Screen 3</p>
<p>PSA values<BR>   @ 12Mo. post R.P.=0.1</p>
<p>   @ 15Mo. post R.P.=0.2</p>
<p>   @ 18Mo. post R.P.=0.4</p>
<p>   @ 21Mo. post R.P.=0.8</p>
</DIV>
</DIV>

This is supposed to turn off the first layer and turn on layers 2 – 4 if someone clicks on the tabs. For a while it was making layers 2-4 show below layer 1, but I changed something and now it does nothing at all.

Any help would be appreciated.

Solution:

ok here you go :]

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
<html>
<head>
<title>Untitled</title>
</head>

<body>
<DIV ID=”program”>
<script language=”javascript”>
var curAd=1;
function swapAd(inpt){
if(curAd!=inpt){
document.getElementById(‘ad0′).style.display=’none’;
document.getElementById(‘adtab’+inpt).className=”selectedtab”;
document.getElementById(‘adtab’+curAd).className=”tab”;
document.getElementById(‘ad’+inpt).style.display=’block’;
document.getElementById(‘ad’+curAd).style.display=’none’;
curAd=inpt;
}
}
</script>
<DIV ID=”programnav”>
<table cellspacing=”0″ cellpadding=”0″>
<tr>
<td id=”adtab1″ onclick=”swapAd(1)”><li><a href=”#”>Presentation</a></td>
<td id=”adtab2″ onclick=”swapAd(2)”><li><a href=”#”>Treatment Options</a></td>
<td id=”adtab3″ onclick=”swapAd(3)”><li><a href=”#”>Post-Tx Surveillance</a></li></td>
</tr>
</table>
</DIV>
<div style=”display: block; background: #FBDC9B; height:250px;margin-top:0;padding:10px 10px 10px 10px;” id=”ad0″>
<p>To review the case study details, click on the tabs above.</p>
</DIV>
<div style=”display: none; background: #FBDC9B; height:250px;margin-top:0;padding:10px 10px 10px 10px;” id=”ad1″>
<p>60 Year Old Healthy Male</p>
<p>No Comorbidities</p>
<p>T2c, Gleason 4+3,7/12</p>
<p>Cores Positive (Bilateral)</p>
<p>PSA=10, PSA 1r ago=4</p>
<p>Bone Scan -NEG</p>
</DIV>
<div style=”display: none; background: #FBDC9B; height:250px;margin-top:0;padding:10px 10px 10px 10px;” id=”ad2″>
<p>RRP with Bilateral LND Performed.</p>
<p>Pathology: Gleason 4+4, ECE Present; Margins, SV & Nodes are Negative.</p>
<p>Stage pT3a N-</p>
</DIV>
<div style=”display: none; background: #FBDC9B; height:250px;margin-top:0;padding:10px 10px 10px 10px;” id=”ad3″>
<p>Screen 3</p>
<p>PSA values<BR>   @ 12Mo. post R.P.=0.1</p>
<p>   @ 15Mo. post R.P.=0.2</p>
<p>   @ 18Mo. post R.P.=0.4</p>
<p>   @ 21Mo. post R.P.=0.8</p>
</DIV>
</DIV>