Javascript help

[Kadenz]

Well, this script works, but not for IE or Netscape, only Firefox.
What's wrong??

	  <script type="text/javascript">
	  <!--
	  function shoutbox() {
	  	if (document.getElementById("theboxofshouts").style.visibility == "collapse") {
			document.getElementById("theboxofshouts").style.visibility = "visible";
			document.getElementById("shoutboxlink").innerHTML = "Close Shoutbox";
		} else {
			document.getElementById("theboxofshouts").style.visibility = "collapse";
			document.getElementById("shoutboxlink").innerHTML = "Open Shoutbox";
		}
	  }
	  -->
	  </script>

 

[Dan]

Do you have style="visibility: collapse;" or style="visibility: visible;" in #theboxofshouts' CSS? If you don't add it one way or the other.

 

[Kadenz]

Yes, I have that, as I said it works fine in FF but not IE and NS8.1

 

[Dan]

I think the problem is with how IE handles "visibility: collapse;".

Try using 'display: none;' instead of 'visibility: collapse;' and 'display: block;' instead of 'visibility: visible';

edit: Tested and it works.

 

[Kirtan]

Here is all browser compaitable code to show-hide layers

<html>
<head><title>hi</title>
<script language=javascript>
function formshowhide(id)
{
if(id == "quote")
{
document.getElementById('quotef').style.display = "block";
document.getElementById('otherf').style.display = "none";
}
else
{
document.getElementById('quotef').style.display = "none";
document.getElementById('otherf').style.display = "block";
}
}
</script>
</head>
<body>
<form>
<span style="color: #1F85E7;">Name:</span> <input type="text"><p>
<span style="color: #1F85E7;">Email:</span> <input type="text"><p>
<span style="color: #1F85E7;">Subject:</span>
<label>
<input type="radio" name="ShowHide" value="quote" onClick="formshowhide('quote')">
Quote</label>
<br>
<label>
<input type="radio" name="ShowHide" value="other" onClick="formshowhide('other')">
Other</label>
<br>
<div id="quotef">
<span style="color: #1F85E7;">Description:</span><br><textarea></textarea>
</div>
<div id="otherf" style="display:none;">
<span style="color: #1F85E7;">Additional Comments:</span><br><textarea></textarea>
</div>
</form>
</body>
</html>