sureshp
asked on
Can anyone solve
Hi all,
The below code is an example for div. The code will expand and collapse div.
I would like to expand the first div onLoad and other div should be collapse. Now all div are in expand form. So can anyone modify this code to display the first div content and other div in collapse.
Code
-----
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Switch menu</title>
<style type="text/css">
<!--
body {
text-align:center;
margin:30px;
}
#wrapper {
text-align:left;
margin:0 auto;
width:500px;
min-height:100px;
border:1px solid #ccc;
padding:30px;
}
a {
color:blue;
cursor:pointer;
}
#myvar {
border:1px solid #ccc;
background:#f2f2f2;
padding:20px;
}
-->
</style>
<script type="text/javascript">
<!--
function switchMenu(obj) {
var el = document.getElementById(ob
if ( el.style.display != "none" ) {
el.style.display = 'none';
}
else {
el.style.display = '';
}
}
function test() {
document.getElementById("m
}
//-->
</script>
</head>
<body onLoad="test();">
<div id="wrapper">
<p><a onclick="switchMenu('myvar
<div id="myvar">
<p>This is paragraph text that is all up in this place that does some pretty cool stuff</p>
<p>This is paragraph text that is all up in this place that does some pretty cool stuff</p>
<p>This is paragraph text that is all up in this place that does some pretty cool stuff</p>
<p>This is paragraph text that is all up in this place that does some pretty cool stuff</p>
</div>
<p><a onclick="switchMenu('myvar
<div id="myvar1">
<p>Second Paragraph</p>
<p>This is paragraph text that is all up in this place that does some pretty cool stuff</p>
<p>This is paragraph text that is all up in this place that does some pretty cool stuff</p>
<p>This is paragraph text that is all up in this place that does some pretty cool stuff</p>
</div>
</div>
</body>
</html>
Thanks
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
rad, Don't know if that was directed at me but if it was, notice that we posted at the same time so I did not see your response. I was attempting an answer to the original question. Sorry if it seems that I was stepping on your toes.
Nah, didn't feel anything....
I like the code the poster supplied. They had the right idea and on right track. Just needed to call the same code for PARA2 with the onLoad event and it works!!!
I like the code the poster supplied. They had the right idea and on right track. Just needed to call the same code for PARA2 with the onLoad event and it works!!!
I did a "copy n' paste" and the code works.
Just call the onClick event (used when clicking "para 2") when the page is loaded and make PARA 2 collapse.