레이어 관리 예제
<head>
<META HTTP-EQUIV="Content-Type" ConTENT="text/html;charset=euc-kr">
<script language="Javascript1.2">
if (document.all) {
layerview='document.all'
styleview='.style.'
}
else if (document.layers) {
layerview='document.layers'
styleview='.'
}
function show(){
eval(layerview+'["layer_1"]'+styleview+'visibility="visible"');
eval(layerview+'["layer_2"]'+styleview+'visibility="hidden"');
eval(layerview+'["menu_1"]'+styleview+'visibility="visible"');
eval(layerview+'["menu_2"]'+styleview+'visibility="hidden"');
}
function hide(){
eval(layerview+'["layer_1"]'+styleview+'visibility="hidden"')
eval(layerview+'["layer_2"]'+styleview+'visibility="visible"');
eval(layerview+'["menu_1"]'+styleview+'visibility="hidden"');
eval(layerview+'["menu_2"]'+styleview+'visibility="visible"');
}
</script>
</head>
<body topmargin=20 leftmargin=20>
<p>
<div id=menu_1 style="height: 300px; width: 300px; position: absolute; top: 0px; left: 20px"> [<a onClick="javascript:hide('layer_1')">레이어1 숨기기, 레이어2 보이기</a>]</div> :::
<div id=menu_2 style="height: 300px; width: 300px; position: absolute; top: 0px; left: 220px"> [<a onClick="javascript:show('layer_1')">레이어1 보이기, 레이어2 숨기기</a>]</div>
<div id=layer_1 style="height: 300px; width: 300px; position: absolute; top: 50px; left: 20px">
레이어1
</div>
<div id=layer_2 style="height: 300px; width: 300px; position: absolute; top: 50px; left: 20px">
레이어2
</div>
<script language="Javascript1.2">
hide('layer_1');
</script>
</body>
댓글
댓글 쓰기