Debt Consolidation - Computer Jobs - Debt Consolidation - Web Hosting - Debt Consolidation
PDA

View Full Version : Show/Hide div NOT workink in FF

zed420
Dec 22nd 2008, 4:20 am
Hi All
Can anyone please tell me why doesn't this code work in Firefox. I'm using it for showing and hiding the divs. Woks fine in IE.
Some help will be greatly appreciated.
<script type="text/javascript"><!--
var lastDiv = "";
function showDiv(divName) {
// hide last div
if (lastDiv) {
document.getElementById(lastDiv).className = "hiddenDiv";
}
if (divName && document.getElementById(divName)) {
document.getElementById(divName).className = "visibleDiv";
lastDiv = divName;
}
}
//-->
</script>
Thanks
Zed
ferdousx
Dec 22nd 2008, 11:22 am
the problem can also be in the css or html. can u provide those?
zed420
Dec 26th 2008, 1:23 pm
Thanks you were right problem was in html i was using <p> instead of <div> the name of hiden div.

Thanks
zed
jefzalez
Jun 12th 2009, 9:37 am
Hello, I am a complete novice to javascript and css. I have taken this piece of code and have it working correctly in Firefox, but cannot get it to work in IE.Thank you for any advice.


I am attaching the HTML below:
Does it have anything to do with Doctype?


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Get the National Hurricane Center LIVE Video Feed...</title>



<script type="text/javascript" language="JavaScript">
<!--
function HideContent(d) {
if(d.length < 1) { return; }
document.getElementById(d).style.display = "none";
}
function ShowContent(d) {
if(d.length < 1) { return; }
document.getElementById(d).style.display = "block";
}
function ReverseContentDisplay(d) {
if(d.length < 1) { return; }
if(document.getElementById(d).style.display == "none") { document.getElementById(d).style.display = "block"; }
else { document.getElementById(d).style.display = "none"; }
}
//-->
</script>


</head>

<table width="310" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="images/top_curve2.jpg" alt="AEN NHC LIVE VIDEO" width="299" height="30" /></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td>
<a onRelease="ShowContent('step1div'); return true;"
href="javascript:ShowContent('step1div')" >

<img src="images/step1.jpg" width="299" height="120" border="0"/></a>

<div
id="step1div"
style="display:none;
position:absolute;
left:490px;
top:178px;
border-style: none;
padding: 0px;">

<a onRelease="HideContent('step1div'); return true;"
href="javascript:HideContent('step1div')" <img src="images/step1_full_down.jpg" width="299" height="382" border="0"/>

</a> </div>






</td>
</tr>
<tr>
<td>

<a onclick="ShowContent('step2div'); return true;"
href="javascript:ShowContent('step2div')" >

<img src="images/step2.jpg" width="299" height="120" border="0"/></a>

<div
id="step2div"
style="display:none;
position:absolute;
left:490px;
top:298px;
border color:red;
border-style: none;
padding: 0px;">



<a onclick="HideContent('step2div'); return true;"
href="javascript:HideContent('step2div')" <img src="images/step2_b_full_down.jpg" width="299" height="223" border="0"/>
</a>
</div>


</td>
</tr>
<tr>
<td>

<a onclick="ShowContent('step3div'); return true; "
href="javascript:ShowContent('step3div')" >

<img src="images/step3.jpg" width="299" height="160" border="0"/></a>

<div
id="step3div"
style="display:none;
position:absolute;
left:490px;
top:418px;
border-style: none;
padding: 0px;">

<a onclick="HideContent('step3div'); return true;"
href="javascript:HideContent('step3div')" <img src="images/step3_c_full_down.jpg" width="299" height="160" border="0" />
</a>
</div>




</td>
</tr>
<tr>
<td>








<img src="images/bottom_curve2.jpg" alt="AEN National Hurricane Center LIVE Feed" width="299" height="30" /></td>
</tr>
</table>

</body>
</html>