...

View Full Version : Not showing or hiding as desired.



3D_Dog_Man
07-12-2004, 03:25 AM
Hi Everyone,

I have written a very small page (and accompanying script) to test the visibility altering behaviour of IE. I am trying to hide or show a <div> element, alternatively based upon a button being pressed. The code does not work as I had hoped, hence why I am posting. If anybody can provide some pointers as to how I might be able to get this code going I will be very appreciative. Thanks heaps.

Regards

Davo

<html>
<head>
<title> Experimenting with toggling element visibility </title>
<style type="text/css">
#box
{
background-color: #00ff00;
left: 50px;
height: 100px;
position: absolute;
top: 50px;
width: 100px;
}
#place_button
{
left: 100px;
position: absolute;
top: 300px;
}
</style>
<script type="text/javascript">

var visibile = true;

function toggleMenu()
{
if(visibile == false)
{
document.getElementById("box").visiblity = "show";
visibile = true;
}
else
if(visibile == true)
{
document.getElementById("box").visibility = "hidden";
visibile = false;
}
}
</script>
</head>
<body>
<div id="box">
<form>
<input id="place_button" type="button" value="Click This" onclick="toggleMenu()">
</form>
</div>
</body>
</html>

dumpfi
07-12-2004, 03:58 AM
Try this:
<html>
<head>
<title> Experimenting with toggling element visibility </title>
<style type="text/css">
#box
{
background-color: #00ff00;
left: 50px;
height: 100px;
position: absolute;
top: 50px;
width: 100px;
}
#place_button
{
left: 100px;
position: absolute;
top: 300px;
}
</style>
<script type="text/javascript">
function toggleMenu(el) {
el.style.visibility = (el.style.visibility == "visible" || !el.style.visibility) ? "hidden" : "visible";
}
</script>
</head>
<body>
<div id="box">
<form>
<input id="place_button" type="button" value="Click This" onClick="toggleMenu(document.getElementById('box'))">
</form>
</div>
</body>
</html>dumpfi

Willy Duitt
07-12-2004, 06:03 AM
Your copy and pasted question was also answered within minutes after posting it here (http://www.webdeveloper.com/forum/showthread.php?threadid=39309).....



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum