마우스오버 스크립트에 관해 여쭤봅니다! 정보
마우스오버 스크립트에 관해 여쭤봅니다!
본문
http://greenopt.com/gnuboard4/shop/item.php?it_id=1010001
위 사이트에 들어가셔서 왼쪽오버메뉴를 봐주세요 ㅠ.ㅠ
첫번째 폴더로 설명드리자면....
PRODUCT - > OPTICS의 하위메뉴를 선택하고싶은데
필터나 빔스플리터 등등 하위 영역이 선택안되어 클릭할 수 없습니다.
하위메뉴에 마우스오버를 할 수 있게 도와주세요!!
<HTML><HEAD>
<META http-equiv=Content-Type content="text/html; charset=euk-kr">
<script type="text/javascript" language="JavaScript">
function layer_toggle(obj) {
if (obj.style.display == 'none') obj.style.display = 'block';
else if (obj.style.display == 'block') obj.style.display = 'none';
}
</script>
</HEAD>
<BODY>
<table width="150" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="<?=$g4[path]?>/images/shop_menu_off_01.gif"></td>
</tr>
<tr><td>
<div id=more01a style="DISPLAY: block">
<A onMouseover="layer_toggle(document.getElementById('more01a')); layer_toggle(document.getElementById('more01b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=1010" >
<img src="<?=$g4[path]?>/images/shop_menu_off_02.gif" border="0" /></A></div>
<div id=more01b style="DISPLAY: none">
<A onMouseout="layer_toggle(document.getElementById('more01a')); layer_toggle(document.getElementById('more01b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=1010" >
<img src="<?=$g4[path]?>/images/shop_menu_on_02.gif" border="0" /></A>
<div class="more">
<a href="<?=$g4[path]?>/shop/list.php?ca_id=1010"><img src="<?=$g4[path]?>/images/shop_menu_off_30.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_30.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_30.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=1020"><img src="<?=$g4[path]?>/images/shop_menu_off_31.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_31.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_31.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=1030"><img src="<?=$g4[path]?>/images/shop_menu_off_32.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_32.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_32.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=1040"><img src="<?=$g4[path]?>/images/shop_menu_off_33.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_33.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_33.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=1050"><img src="<?=$g4[path]?>/images/shop_menu_off_34.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_34.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_34.gif'" border="0"></a>
</DIV></td></tr>
<tr><td>
<div id=more02a style="DISPLAY: block">
<A onMouseover="layer_toggle(document.getElementById('more02a')); layer_toggle(document.getElementById('more02b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=2010" >
<img src="<?=$g4[path]?>/images/shop_menu_off_03.gif" border="0" /></A></div>
<div id=more02b style="DISPLAY: none">
<A onMouseout="layer_toggle(document.getElementById('more02a')); layer_toggle(document.getElementById('more02b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=2010" >
<img src="<?=$g4[path]?>/images/shop_menu_on_03.gif" border="0" /></A>
<div class="more">
<a href="<?=$g4[path]?>/shop/list.php?ca_id=2010"><img src="<?=$g4[path]?>/images/shop_menu_off_35.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_35.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_35.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=2020"><img src="<?=$g4[path]?>/images/shop_menu_off_36.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_36.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_36.gif'" border="0"></a>
</DIV></td></tr>
<tr><td>
<div id=more03a style="DISPLAY: block">
<A onMouseover="layer_toggle(document.getElementById('more03a')); layer_toggle(document.getElementById('more03b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=3010" >
<img src="<?=$g4[path]?>/images/shop_menu_off_04.gif" border="0" /></A></div>
<div id=more03b style="DISPLAY: none">
<A onMouseout="layer_toggle(document.getElementById('more03a')); layer_toggle(document.getElementById('more03b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=3010" >
<img src="<?=$g4[path]?>/images/shop_menu_on_04.gif" border="0" /></A>
<div class="more">
<a href="<?=$g4[path]?>/shop/list.php?ca_id=3010"><img src="<?=$g4[path]?>/images/shop_menu_off_37.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_37.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_37.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=3020"><img src="<?=$g4[path]?>/images/shop_menu_off_38.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_38.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_38.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=3030"><img src="<?=$g4[path]?>/images/shop_menu_off_39.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_39.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_39.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=3040"><img src="<?=$g4[path]?>/images/shop_menu_off_40.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_40.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_40.gif'" border="0"></a>
</DIV></td></tr>
<tr><td>
<div id=more04a style="DISPLAY: block">
<A onMouseover="layer_toggle(document.getElementById('more04a')); layer_toggle(document.getElementById('more04b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=4010" >
<img src="<?=$g4[path]?>/images/shop_menu_off_05.gif" border="0" /></A></div>
<div id=more04b style="DISPLAY: none">
<A onMouseout="layer_toggle(document.getElementById('more04a')); layer_toggle(document.getElementById('more04b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=4010" >
<img src="<?=$g4[path]?>/images/shop_menu_on_05.gif" border="0" /></A>
<div class="more">
<a href="<?=$g4[path]?>/shop/list.php?ca_id=4010"><img src="<?=$g4[path]?>/images/shop_menu_off_41.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_41.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_41.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=4020"><img src="<?=$g4[path]?>/images/shop_menu_off_42.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_42.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_42.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=4030"><img src="<?=$g4[path]?>/images/shop_menu_off_43.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_43.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_43.gif'" border="0"></a>
</DIV></td></tr>
<tr><td>
<div id=more05a style="DISPLAY: block">
<A onMouseover="layer_toggle(document.getElementById('more05a')); layer_toggle(document.getElementById('more05b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=5010" >
<img src="<?=$g4[path]?>/images/shop_menu_off_06.gif" border="0" /></A></div>
<div id=more05b style="DISPLAY: none">
<A onMouseout="layer_toggle(document.getElementById('more05a')); layer_toggle(document.getElementById('more05b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=5010" >
<img src="<?=$g4[path]?>/images/shop_menu_on_06.gif" border="0" /></A>
<div class="more">
<a href="<?=$g4[path]?>/shop/list.php?ca_id=5010"><img src="<?=$g4[path]?>/images/shop_menu_off_44.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_44.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_44.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=5020"><img src="<?=$g4[path]?>/images/shop_menu_off_45.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_45.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_45.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=5030"><img src="<?=$g4[path]?>/images/shop_menu_off_46.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_46.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_46.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=5040"><img src="<?=$g4[path]?>/images/shop_menu_off_47.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_47.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_47.gif'" border="0"></a>
</DIV></td></tr>
<tr><td>
<div id=more06a style="DISPLAY: block">
<A onMouseover="layer_toggle(document.getElementById('more06a')); layer_toggle(document.getElementById('more06b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=6010" >
<img src="<?=$g4[path]?>/images/shop_menu_off_07.gif" border="0" /></A></div>
<div id=more06b style="DISPLAY: none">
<A onMouseout="layer_toggle(document.getElementById('more06a')); layer_toggle(document.getElementById('more06b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=6010" >
<img src="<?=$g4[path]?>/images/shop_menu_on_07.gif" border="0" /></A>
<div class="more">
<a href="<?=$g4[path]?>/shop/list.php?ca_id=6010"><img src="<?=$g4[path]?>/images/shop_menu_off_48.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_48.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_48.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=6020"><img src="<?=$g4[path]?>/images/shop_menu_off_49.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_49.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_49.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=6030"><img src="<?=$g4[path]?>/images/shop_menu_off_50.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_50.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_50.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=6040"><img src="<?=$g4[path]?>/images/shop_menu_off_51.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_51.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_51.gif'" border="0"></a>
</DIV></td></tr>
<tr><td>
<div id=more07a style="DISPLAY: block">
<A onMouseover="layer_toggle(document.getElementById('more07a')); layer_toggle(document.getElementById('more07b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=7010" >
<img src="<?=$g4[path]?>/images/shop_menu_off_08.gif" border="0" /></A></div>
<div id=more07b style="DISPLAY: none">
<A onMouseout="layer_toggle(document.getElementById('more07a')); layer_toggle(document.getElementById('more07b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=7010" >
<img src="<?=$g4[path]?>/images/shop_menu_on_08.gif" border="0" /></A>
<div class="more">
<a href="<?=$g4[path]?>/shop/list.php?ca_id=7010"><img src="<?=$g4[path]?>/images/shop_menu_off_52.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_52.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_52.gif'" border="0"></a>
</DIV></td></tr>
<tr>
<td style="padding:10px 0 0 0"><img src="<?=$g4[path]?>/images/shop_menu_off_20.gif"></tr>
<tr>
<td><a href="<?=$g4[path]?>/bbs/board.php?bo_table=shop_01"><img src="<?=$g4[path]?>/images/shop_menu_off_21.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_21.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_21.gif'" border="0"></a></td>
</tr>
<tr>
<td><a href="<?=$g4[path]?>/bbs/board.php?bo_table=shop_02"><img src="<?=$g4[path]?>/images/shop_menu_off_22.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_22.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_22.gif'" border="0"></a></td>
</tr>
<tr>
<td><a href="<?=$g4[path]?>/bbs/board.php?bo_table=shop_03"><img src="<?=$g4[path]?>/images/shop_menu_off_23.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_23.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_23.gif'" border="0"></a></td>
</tr>
<tr>
<td><a href="<?=$g4[path]?>/shop/list.php?ca_id=1010"><img src="<?=$g4[path]?>/images/shop_menu_off_24.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_24.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_24.gif'" border="0"></a></td>
</tr>
<tr>
<td style="padding:20px 0 0 0"><img src="<?=$g4[path]?>/images/shop_menu_on_29.gif"></tr>
</tr>
</table>
</BODY></HTML>
위 사이트에 들어가셔서 왼쪽오버메뉴를 봐주세요 ㅠ.ㅠ
첫번째 폴더로 설명드리자면....
PRODUCT - > OPTICS의 하위메뉴를 선택하고싶은데
필터나 빔스플리터 등등 하위 영역이 선택안되어 클릭할 수 없습니다.
하위메뉴에 마우스오버를 할 수 있게 도와주세요!!
<HTML><HEAD>
<META http-equiv=Content-Type content="text/html; charset=euk-kr">
<script type="text/javascript" language="JavaScript">
function layer_toggle(obj) {
if (obj.style.display == 'none') obj.style.display = 'block';
else if (obj.style.display == 'block') obj.style.display = 'none';
}
</script>
</HEAD>
<BODY>
<table width="150" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="<?=$g4[path]?>/images/shop_menu_off_01.gif"></td>
</tr>
<tr><td>
<div id=more01a style="DISPLAY: block">
<A onMouseover="layer_toggle(document.getElementById('more01a')); layer_toggle(document.getElementById('more01b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=1010" >
<img src="<?=$g4[path]?>/images/shop_menu_off_02.gif" border="0" /></A></div>
<div id=more01b style="DISPLAY: none">
<A onMouseout="layer_toggle(document.getElementById('more01a')); layer_toggle(document.getElementById('more01b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=1010" >
<img src="<?=$g4[path]?>/images/shop_menu_on_02.gif" border="0" /></A>
<div class="more">
<a href="<?=$g4[path]?>/shop/list.php?ca_id=1010"><img src="<?=$g4[path]?>/images/shop_menu_off_30.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_30.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_30.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=1020"><img src="<?=$g4[path]?>/images/shop_menu_off_31.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_31.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_31.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=1030"><img src="<?=$g4[path]?>/images/shop_menu_off_32.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_32.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_32.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=1040"><img src="<?=$g4[path]?>/images/shop_menu_off_33.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_33.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_33.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=1050"><img src="<?=$g4[path]?>/images/shop_menu_off_34.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_34.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_34.gif'" border="0"></a>
</DIV></td></tr>
<tr><td>
<div id=more02a style="DISPLAY: block">
<A onMouseover="layer_toggle(document.getElementById('more02a')); layer_toggle(document.getElementById('more02b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=2010" >
<img src="<?=$g4[path]?>/images/shop_menu_off_03.gif" border="0" /></A></div>
<div id=more02b style="DISPLAY: none">
<A onMouseout="layer_toggle(document.getElementById('more02a')); layer_toggle(document.getElementById('more02b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=2010" >
<img src="<?=$g4[path]?>/images/shop_menu_on_03.gif" border="0" /></A>
<div class="more">
<a href="<?=$g4[path]?>/shop/list.php?ca_id=2010"><img src="<?=$g4[path]?>/images/shop_menu_off_35.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_35.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_35.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=2020"><img src="<?=$g4[path]?>/images/shop_menu_off_36.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_36.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_36.gif'" border="0"></a>
</DIV></td></tr>
<tr><td>
<div id=more03a style="DISPLAY: block">
<A onMouseover="layer_toggle(document.getElementById('more03a')); layer_toggle(document.getElementById('more03b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=3010" >
<img src="<?=$g4[path]?>/images/shop_menu_off_04.gif" border="0" /></A></div>
<div id=more03b style="DISPLAY: none">
<A onMouseout="layer_toggle(document.getElementById('more03a')); layer_toggle(document.getElementById('more03b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=3010" >
<img src="<?=$g4[path]?>/images/shop_menu_on_04.gif" border="0" /></A>
<div class="more">
<a href="<?=$g4[path]?>/shop/list.php?ca_id=3010"><img src="<?=$g4[path]?>/images/shop_menu_off_37.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_37.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_37.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=3020"><img src="<?=$g4[path]?>/images/shop_menu_off_38.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_38.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_38.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=3030"><img src="<?=$g4[path]?>/images/shop_menu_off_39.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_39.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_39.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=3040"><img src="<?=$g4[path]?>/images/shop_menu_off_40.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_40.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_40.gif'" border="0"></a>
</DIV></td></tr>
<tr><td>
<div id=more04a style="DISPLAY: block">
<A onMouseover="layer_toggle(document.getElementById('more04a')); layer_toggle(document.getElementById('more04b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=4010" >
<img src="<?=$g4[path]?>/images/shop_menu_off_05.gif" border="0" /></A></div>
<div id=more04b style="DISPLAY: none">
<A onMouseout="layer_toggle(document.getElementById('more04a')); layer_toggle(document.getElementById('more04b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=4010" >
<img src="<?=$g4[path]?>/images/shop_menu_on_05.gif" border="0" /></A>
<div class="more">
<a href="<?=$g4[path]?>/shop/list.php?ca_id=4010"><img src="<?=$g4[path]?>/images/shop_menu_off_41.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_41.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_41.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=4020"><img src="<?=$g4[path]?>/images/shop_menu_off_42.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_42.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_42.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=4030"><img src="<?=$g4[path]?>/images/shop_menu_off_43.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_43.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_43.gif'" border="0"></a>
</DIV></td></tr>
<tr><td>
<div id=more05a style="DISPLAY: block">
<A onMouseover="layer_toggle(document.getElementById('more05a')); layer_toggle(document.getElementById('more05b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=5010" >
<img src="<?=$g4[path]?>/images/shop_menu_off_06.gif" border="0" /></A></div>
<div id=more05b style="DISPLAY: none">
<A onMouseout="layer_toggle(document.getElementById('more05a')); layer_toggle(document.getElementById('more05b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=5010" >
<img src="<?=$g4[path]?>/images/shop_menu_on_06.gif" border="0" /></A>
<div class="more">
<a href="<?=$g4[path]?>/shop/list.php?ca_id=5010"><img src="<?=$g4[path]?>/images/shop_menu_off_44.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_44.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_44.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=5020"><img src="<?=$g4[path]?>/images/shop_menu_off_45.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_45.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_45.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=5030"><img src="<?=$g4[path]?>/images/shop_menu_off_46.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_46.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_46.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=5040"><img src="<?=$g4[path]?>/images/shop_menu_off_47.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_47.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_47.gif'" border="0"></a>
</DIV></td></tr>
<tr><td>
<div id=more06a style="DISPLAY: block">
<A onMouseover="layer_toggle(document.getElementById('more06a')); layer_toggle(document.getElementById('more06b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=6010" >
<img src="<?=$g4[path]?>/images/shop_menu_off_07.gif" border="0" /></A></div>
<div id=more06b style="DISPLAY: none">
<A onMouseout="layer_toggle(document.getElementById('more06a')); layer_toggle(document.getElementById('more06b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=6010" >
<img src="<?=$g4[path]?>/images/shop_menu_on_07.gif" border="0" /></A>
<div class="more">
<a href="<?=$g4[path]?>/shop/list.php?ca_id=6010"><img src="<?=$g4[path]?>/images/shop_menu_off_48.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_48.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_48.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=6020"><img src="<?=$g4[path]?>/images/shop_menu_off_49.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_49.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_49.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=6030"><img src="<?=$g4[path]?>/images/shop_menu_off_50.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_50.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_50.gif'" border="0"></a><br />
<a href="<?=$g4[path]?>/shop/list.php?ca_id=6040"><img src="<?=$g4[path]?>/images/shop_menu_off_51.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_51.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_51.gif'" border="0"></a>
</DIV></td></tr>
<tr><td>
<div id=more07a style="DISPLAY: block">
<A onMouseover="layer_toggle(document.getElementById('more07a')); layer_toggle(document.getElementById('more07b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=7010" >
<img src="<?=$g4[path]?>/images/shop_menu_off_08.gif" border="0" /></A></div>
<div id=more07b style="DISPLAY: none">
<A onMouseout="layer_toggle(document.getElementById('more07a')); layer_toggle(document.getElementById('more07b'));return false;" href="<?=$g4[path]?>/shop/list.php?ca_id=7010" >
<img src="<?=$g4[path]?>/images/shop_menu_on_08.gif" border="0" /></A>
<div class="more">
<a href="<?=$g4[path]?>/shop/list.php?ca_id=7010"><img src="<?=$g4[path]?>/images/shop_menu_off_52.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_52.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_52.gif'" border="0"></a>
</DIV></td></tr>
<tr>
<td style="padding:10px 0 0 0"><img src="<?=$g4[path]?>/images/shop_menu_off_20.gif"></tr>
<tr>
<td><a href="<?=$g4[path]?>/bbs/board.php?bo_table=shop_01"><img src="<?=$g4[path]?>/images/shop_menu_off_21.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_21.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_21.gif'" border="0"></a></td>
</tr>
<tr>
<td><a href="<?=$g4[path]?>/bbs/board.php?bo_table=shop_02"><img src="<?=$g4[path]?>/images/shop_menu_off_22.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_22.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_22.gif'" border="0"></a></td>
</tr>
<tr>
<td><a href="<?=$g4[path]?>/bbs/board.php?bo_table=shop_03"><img src="<?=$g4[path]?>/images/shop_menu_off_23.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_23.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_23.gif'" border="0"></a></td>
</tr>
<tr>
<td><a href="<?=$g4[path]?>/shop/list.php?ca_id=1010"><img src="<?=$g4[path]?>/images/shop_menu_off_24.gif" onMouseOver="this.src='<?=$g4[path]?>/images/shop_menu_on_24.gif'" onMouseOut="this.src='<?=$g4[path]?>/images/shop_menu_off_24.gif'" border="0"></a></td>
</tr>
<tr>
<td style="padding:20px 0 0 0"><img src="<?=$g4[path]?>/images/shop_menu_on_29.gif"></tr>
</tr>
</table>
</BODY></HTML>
댓글 전체
수정하기엔 처음부터 소스에 문제가 있는거같네요.. onMouseOut는 해당하는 영역을 지나면 바로 실행되는건데..그럼 2depth메뉴를 클릭하려면 무조건 1Depth메뉴를 onMouseOut되야하므로 소스상 오류네요.
다른 샘플소스를 알려드릴테니 참고해보세요.
<script language='javascript'>
<!--
function slide(Id, interval, to)
{
var obj = document.getElementById(Id);
var H, step = 5;
if (obj == null) return;
if (to == undefined) { // user clicking
if (obj._slideStart == true) return;
if (obj._expand == true) {
to = 0;
obj.style.overflow = "hidden";
} else {
slide.addId(Id);
for(var i=0; i < slide.objects.length; i++) {
if (slide.objects[i].id != Id && slide.objects[i]._expand == true) {
slide(slide.objects[i].id);
}
}
obj.style.height = "";
obj.style.overflow = "";
obj.style.display = "block";
to = obj.offsetHeight;
obj.style.overflow = "hidden";
obj.style.height = "1px";
}
obj._slideStart = true;
}
step = ((to > 0) ? 1:-1) * step;
interval = ((interval==undefined)?1:interval);
obj.style.height = (H=((H=(isNaN(H=parseInt(obj.style.height))?0:H))+step<0)?0:H+step)+"px";
if (H <= 0) {
obj.style.display = "none";
obj.style.overflow = "hidden";
obj._expand = false;
obj._slideStart = false;
} else if (to > 0 && H >= to) {
obj.style.display = "block";
obj.style.overflow = "visible";
obj.style.height = H + "px";
obj._expand = true;
obj._slideStart = false;
} else {
setTimeout("slide('"+Id+"' , "+interval+", "+to+");", interval);
}
}
slide.objects = new Array();
slide.addId = function(Id)
{
for (var i=0; i < slide.objects.length; i++) {
if (slide.objects[i].id == Id) return true;
}
slide.objects[slide.objects.length] = document.getElementById(Id);
}
//-->
</script>
<style>
BODY { font-size:9pt; }
.menu {
border:1px solid #CCCCCC;
background-color:#DEDEDE;
padding:3px 1px 1px 5px;
width:150px;
}
.submenu {
width:150px;
padding-left:10px;
display:none;
}
</style>
<div class="menu" onMouseOver="slide('sub1');">Tree1</div>
<div id="sub1" class="submenu">
<div> + SubTree1-1</div>
<div> + SubTree1-2</div>
<div> + SubTree1-3</div>
<div> + SubTree1-4</div>
<div> + SubTree1-5</div>
</div>
<div class="menu" onMouseOver="slide('sub2');">Tree2</div>
<div id="sub2" class="submenu">
<div> + SubTree2-1</div>
<div> + SubTree2-2</div>
<div> + SubTree2-3</div>
<div> + SubTree2-4</div>
</div>
<div class="menu">Other</div>
다른 샘플소스를 알려드릴테니 참고해보세요.
<script language='javascript'>
<!--
function slide(Id, interval, to)
{
var obj = document.getElementById(Id);
var H, step = 5;
if (obj == null) return;
if (to == undefined) { // user clicking
if (obj._slideStart == true) return;
if (obj._expand == true) {
to = 0;
obj.style.overflow = "hidden";
} else {
slide.addId(Id);
for(var i=0; i < slide.objects.length; i++) {
if (slide.objects[i].id != Id && slide.objects[i]._expand == true) {
slide(slide.objects[i].id);
}
}
obj.style.height = "";
obj.style.overflow = "";
obj.style.display = "block";
to = obj.offsetHeight;
obj.style.overflow = "hidden";
obj.style.height = "1px";
}
obj._slideStart = true;
}
step = ((to > 0) ? 1:-1) * step;
interval = ((interval==undefined)?1:interval);
obj.style.height = (H=((H=(isNaN(H=parseInt(obj.style.height))?0:H))+step<0)?0:H+step)+"px";
if (H <= 0) {
obj.style.display = "none";
obj.style.overflow = "hidden";
obj._expand = false;
obj._slideStart = false;
} else if (to > 0 && H >= to) {
obj.style.display = "block";
obj.style.overflow = "visible";
obj.style.height = H + "px";
obj._expand = true;
obj._slideStart = false;
} else {
setTimeout("slide('"+Id+"' , "+interval+", "+to+");", interval);
}
}
slide.objects = new Array();
slide.addId = function(Id)
{
for (var i=0; i < slide.objects.length; i++) {
if (slide.objects[i].id == Id) return true;
}
slide.objects[slide.objects.length] = document.getElementById(Id);
}
//-->
</script>
<style>
BODY { font-size:9pt; }
.menu {
border:1px solid #CCCCCC;
background-color:#DEDEDE;
padding:3px 1px 1px 5px;
width:150px;
}
.submenu {
width:150px;
padding-left:10px;
display:none;
}
</style>
<div class="menu" onMouseOver="slide('sub1');">Tree1</div>
<div id="sub1" class="submenu">
<div> + SubTree1-1</div>
<div> + SubTree1-2</div>
<div> + SubTree1-3</div>
<div> + SubTree1-4</div>
<div> + SubTree1-5</div>
</div>
<div class="menu" onMouseOver="slide('sub2');">Tree2</div>
<div id="sub2" class="submenu">
<div> + SubTree2-1</div>
<div> + SubTree2-2</div>
<div> + SubTree2-3</div>
<div> + SubTree2-4</div>
</div>
<div class="menu">Other</div>
덕분에 잘 해결하였습니다. 감사드립니다
잘 해결되셨다니 다행이네요..^^
