Hi All, 

I have problem using layer. The program below will show and hide a combo 
box using radio button for both IE and NS. 

My problem is that combo box shows on a different position. I've already 
tried to make the position as absolute but it didn't work for 
Netscape 4.x. Also, for IE it overrides the border of the table. 
Can you please take a look ? 

Thank you in advance. 

Best regards, joble. 



<script language="Javascript"> 
<!-- 
var IE5up = document.getElementById && document.all; 
var NS6up = document.getElementById &&! document.all; 
var NS4 = document.layers; 
var IE4 = document.all &&! window.print; 

function show_and_hide(val) { 

if (val=="1") 
{ 
if(IE5up || NS6up) 
{ 
document.getElementById("myLayer1").style.visibility = "hidden"; 
document.getElementById("myLayer2").style.visibility = "visible"; 
} 

else if(NS4) 
{ 
document.layers["myLayer1"].visibility = "hidden"; 
document.layers["myLayer2"].visibility = "visible"; 
} 

else if(IE4) 
{ 
document.all["myLayer1"].style.visibility = "hidden"; 
document.all["myLayer2"].style.visibility = "visible"; 
} 
} 

if (val=="2") 
{ 
if(IE5up || NS6up) 
{ 
document.getElementById("myLayer2").style.visibility = "hidden"; 
document.getElementById("myLayer1").style.visibility = "visible"; 
} 

else if(NS4) 
{ 
document.layers["myLayer2"].visibility = "hidden"; 
document.layers["myLayer1"].visibility = "visible"; 
} 

else if(IE4) 
{ 
document.all["myLayer2"].style.visibility = "hidden"; 
document.all["myLayer1"].style.visibility = "visible"; 
} 
} 

} 

//--> 
</script> 

<table border=1> 

<tr> 
<form> 
<td><input type="radio" name="dhtml" value="1" 
onclick="show_and_hide(this.value);">Parent Customer<br/></td> 
<td><input type="radio" name="dhtml" value="2" 
onclick="show_and_hide(this.value);" checked>SBU Customer<br/></td> 
</form> 
</tr> 

<tr> 
<td valign="top"><b>Customer:</b></td> 
<td valign="top"> 
<div id="myLayer1" style="position:relative; visibility:visible"> 
<form> 
<select> 
<option value="All">SBU Customer </option> 
</select> 
</form> 
</div> 

<div id="myLayer2" style="position:relative;visibility:hidden"> 
<form> 
<select> 
<option value="All">Parent Customer</option> 
</select> 
</form> 
</div> 
</td> 
</tr> 
</table>