After hours of work,I was finally able to get the first step of the script I needed functional. This displays a select box and the value that you choose will turn the div from display:none to display:block. This is good,but I need one more funciton that I cannot figure out. I only want 1 div displaying at a time, and with the function I have right now, if you select a second option then you now have 2 showing, and select another now it is 3. I need it to close the current open div, and then display the newly selected. Here's the code:
If anyone can offer me any help I would be grateful. Thank you!
Code:
<head>
<script type="text/javascript">
function toggleLayer(whichLayer)
{
if (document.getElementById)
{
// this is the way the standards work
var style2 = document.getElementById(whichLayer).style;
style2.display = style2.display? "":"block";
}
else if (document.all)
{
// this is the way old msie versions work
var style2 = document.all[whichLayer].style;
style2.display = style2.display? "":"block";
}
else if (document.layers)
{
// this is the way nn4 works
var style2 = document.layers[whichLayer].style;
style2.display = style2.display? "":"block";
}
}
</script>
</head>
<FORM NAME="myform">
<SELECT NAME="mylist" onChange="toggleLayer(document.myform.mylist.value)">
<OPTION VALUE="m1">1
<OPTION VALUE="m2">2
<OPTION VALUE="m3">3
</SELECT>
</FORM>
<div id="m1" style="display: none">
this is stuff M1</div>
<div id="m2" style="display: none">
this is stuff M2</div>
<div id="m3" style="display: none">
this is stuff M3</div>If anyone can offer me any help I would be grateful. Thank you!