Page 1 of 1

기타 브라우저에서도 사용할 수 있도록 수정좀

Posted: 2005 06 03 02:27 09
by asdf
불여우 확실히 좋군요, 몇달동안 써보더가 사용중인 홈페이지의 서브메뉴가 불여우에서 작동안돼서 이렇게 도움을 청합니다...
IE에서는 잘 되는데 말이죠... 아래는 소스코드입니다...



***** 실행을 위한 자바코드***************************************
<script language=javascript >
function na_show_layer(lname, flag)
{
var layer = (navigator.appName == 'Netscape') ? document.layers[lname] : document.all[lname];
if (lname == '')
return;
if (navigator.appName == 'Netscape')
layer.visibility = (flag == 0) ? 'show' : 'hide';
else
layer.style.visibility = (flag == 0) ? 'visible' : 'hidden';
}
</script>


***** 마우스 오버 **********************************************
<a OnMouseOut="na_show_layer('layer1', 1);" OnMouseOver="na_show_layer('layer1', 0);" style=cursor:hand;>메뉴1</a>
<a OnMouseOut="na_show_layer('layer2', 1);" OnMouseOver="na_show_layer('layer2', 0);" style=cursor:hand;>메뉴2</a>


***** 마우스 오버시 출력될 내용 ***********************************
<div id="layer1" style="position:absolute; top:84px;width:100;visibility:hidden; z-index:1;margin:0 0 0 443;line-height:180%;" OnMouseOut="na_show_layer('layer1', 1);" OnMouseOver="na_show_layer('layer1', 0);">내용1</div>

<div id="layer2" style="position:absolute; top:84px;width:100;visibility:hidden; z-index:1;margin:0 0 0 443;line-height:180%;" OnMouseOut="na_show_layer('layer2', 1);" OnMouseOver="na_show_layer('layer2', 0);">내용2</div>


**************************************************************

꼭 좀 부탁드립니다, 이젠 IE는 켜기도 싫어지는군요 -_-;;; 무거워서 어디...

Posted: 2005 06 03 09:35 45
by hyeonseok

Code: Select all

<script type="text/javascript">
function na_show_layer(lname, flag)
{
var layer = document.getElementById(lname);

if (layer)
	layer.style.visibility = (flag == 0) ? "visible" : "hidden";
}
</script>

***** 마우스 오버 **********************************************
<a OnMouseOut="na_show_layer('layer1', 1);" OnMouseOver="na_show_layer('layer1', 0);" style="cursor: pointer;">메뉴1
<a OnMouseOut="na_show_layer('layer2', 1);" OnMouseOver="na_show_layer('layer2', 0);" style="cursor: pointer;">메뉴2


***** 마우스 오버시 출력될 내용 ***********************************
<div id="layer1" style="position:absolute; top:84px;width:100px;visibility:hidden; z-index:1;margin:0 0 0 443px;line-height:180%;" OnMouseOut="na_show_layer('layer1', 1);" OnMouseOver="na_show_layer('layer1', 0);">내용1</div>

<div id="layer2" style="position:absolute; top:84px;width:100px;visibility:hidden; z-index:1;margin:0 0 0 443px;line-height:180%;" OnMouseOut="na_show_layer('layer2', 1);" OnMouseOver="na_show_layer('layer2', 0);">내용2</div>


************************************************************** 
근데 하위메뉴를 선택 할 수는 없군요. style 의 문제인듯.

Re: 기타 브라우저에서도 사용할 수 있도록

Posted: 2005 06 04 10:02 41
by 박민권
asdf wrote: <script language=javascript >
function na_show_layer(lname, flag)
{
var layer = (navigator.appName == 'Netscape') ? document.layers[lname] : document.all[lname];
if (lname == '')
return;
if (navigator.appName == 'Netscape')
layer.visibility = (flag == 0) ? 'show' : 'hide';
else
layer.style.visibility = (flag == 0) ? 'visible' : 'hidden';
}
</script>
<script type="text/javascript">로 바꿔주세요. 실행에 문제가 없다고 해도 표준입니다.

Code: Select all

function na_show_layer(lname, flag)
{
  if (lname=="") return;
  var layer = document.getElementById(lname);
  layer.style.visibility = (flag == 0) ? 'visible' : 'hidden';
}
이렇게만 하셔도 됩니다.
style에서 visibility: hidden; 은 모습은 사라지지만 자리를 차지합니다.
display: none; 이렇게 하시면 모습도 사라지고 자리도 차지하지 않습니다.

적용해 보시겠다면 스크립트 코드를 아래처럼 바꾸고
layer.style.display = (flag == 0) ? '' : 'none';

레이어 스타일에 visivility를 지우시면 됩니다.
<div id="layer1" style="position:absolute; top:84px;width:100px; z-index:1;margin:0 0 0 443px;line-height:180%;"

제가 위에 입력한 코드에 오타나 버그가 없길 바랍니다. ^^;