I'm writing a javascript function that is supposed to open and close a box
by adjusting the height style of a div container, everytime the link is
clicked. For some reason though, the function only works once--I click and
it opens, and then I click again and it closes--then it never does it again.
Why doesn't it do it again? I plan to have multiple div containers on the
page that do the same thing, but for some reason they stop after the first
close. Help would be appreciated--thanks.
----------------------------------------------------------------------------
-------
<html>
<head>
<style type="text/css">
body {background:#87A7CA}
a {color:#BFE733}
..script {
width:400px;
height:20px;
border-right:2px solid #233949;
border-bottom:2px solid #233949;
margin-bottom:5px;
background:#3B607C;
font:12px arial;
color:#7BB4DF;
overflow:hidden
}
</style>
<script type="text/javascript">
function opener(box,heightto) {
var boxheight = document.getElementById(box)
if (boxheight.style.height < heightto) {
boxheight.style.height = heightto;
}
else {
boxheight.style.height = "20px";
}
}
</script>
</head>
<body>
<div id="blah" class="script"><a href="#"
onClick="opener('blah','200px')">Open/Close</a><br>
<br>
CONTENT<br>
<br>
CONTENT<br>
<br>
CONTENT<br>
<br>
CONTENT<br>
<br>
CONTENT<br>
<br>
CONTENT<br>
<br>
CONTENT</div>
</body>
</html>