<html>
<head>
<title>Collapsing Forms</title>
<style type="text/css">
</style>
<script type="text/javascript">
window.onload=setup;
function setup() {
document.getElementById('one').style.display='none';
document.getElementById('two').style.display='none';
}
function show(newItem) {
var item = document.getElementById(newItem);
if (item.style.display=='none') {
item.style.display='block';
} else {
item.style.display='none';
}
}
</script>
</head>
<body>
<form>
<div class="label" onclick="show('one')">Name(click me to expand)</div>
<div class="elements" id="one">
<label>First Name:</label><br /><input type="text" name="firstname" />
</div>
<div class="label" onclick="show('two')">Address(click me to expand)</div>
<div class="elements" id="two">
<label>Street Address:</label><br /><input type="text" name="street" />
</div>
</form>
</body>
</html>
| 