<script>
function showSubMenu(obj) {
document.all[obj].style.visibility = '';
}
function hideSubMenu(obj) {
document.all[obj].style.visibility = 'hidden';
}
</script>
function showSubMenu(obj) {
document.all[obj].style.visibility = '';
}
function hideSubMenu(obj) {
document.all[obj].style.visibility = 'hidden';
}
</script>
<a href="#" onMouseOver="showSubMenu('SubMenu1')" onMouseout="hideSubMenu('SubMenu1')" onfocus=blur()><img src="/images_ssket/kor/menu_01.gif" border="0" name="image1"></a>
<table id="mytable"><tr><td>
<div id=SubMenu1 style="position:absolute; z-index:1; top:expression(eval(mytable.offsetTop)+10);left:expression(eval(mytable.offsetLeft)+10); visibility: hidden" onMouseOver="showSubMenu('SubMenu1')" onMouseout="hideSubMenu('SubMenu1')">서브메뉴</div></td></tr></table>
<div id=SubMenu1 style="position:absolute; z-index:1; top:expression(eval(mytable.offsetTop)+10);left:expression(eval(mytable.offsetLeft)+10); visibility: hidden" onMouseOver="showSubMenu('SubMenu1')" onMouseout="hideSubMenu('SubMenu1')">서브메뉴</div></td></tr></table>
메뉴를 클릭하면 아래 서브메뉴가 나오는 구조인데요..
문제는 onMouseOut 때문에.. 큰 메뉴에서 마우스가 벗어나면
서브메뉴도 사라져 버려요 ㅠㅠ
온마우스 아웃을 아예 빼버렸더니..
서브메뉴가 다시 로드가 안되더라구요..
어떻게 방법이 없을까요? 도움 부탁드려요..
댓글 2개
13년 전
<style>td{cursor:hand}</style>
<script>
function menuOn(name) {
submenu = eval("submenu"+name+".style");
submenu.visibility = "visible";
}
function menuOff(name) {
submenu = eval("submenu"+name+".style");
submenu.visibility = "hidden";
}
</script>
<table bgcolor=dddddd width=180 height=30 cellpadding=0 cellspacing=0>
<tr>
<td align=center onMouseOver="menuOn(1)" onMouseOut="menuOff(1)" style="width:100px;height:40;">대메뉴1</td>
<td align=center onMouseOver="menuOn(2)" onMouseOut="menuOff(2)" style="width:100px;height:40;">대메뉴2</td>
</tr>
</table>
<div id="submenu1" onMouseOver="menuOn(1)" onMouseOut="menuOff(1)" style="position:absolute; left:10; top:45; visibility:hidden; background-color:eeeeee;list-style:none;">
<table cellpadding=0 cellspacing=0>
<tr><td><img src="1" alt="소메뉴1-1"></td><td><img src="1" alt="소메뉴1-2"></td></tr>
</table>
</div>
<div id="submenu2" onMouseOver="menuOn(2)" onMouseOut="menuOff(2)" style="position:absolute; left:100; top:45; visibility:hidden; background-color:eeeeee;">
<table cellpadding=0 cellspacing=0>
<tr><td><img src="1" alt="소메뉴2-1"></td><td><img src="1" alt="소메뉴2-2"></td></tr>
</table>
</div>
자주 쓰는 소스입니다 참고 하세요 ㅎ
<script>
function menuOn(name) {
submenu = eval("submenu"+name+".style");
submenu.visibility = "visible";
}
function menuOff(name) {
submenu = eval("submenu"+name+".style");
submenu.visibility = "hidden";
}
</script>
<table bgcolor=dddddd width=180 height=30 cellpadding=0 cellspacing=0>
<tr>
<td align=center onMouseOver="menuOn(1)" onMouseOut="menuOff(1)" style="width:100px;height:40;">대메뉴1</td>
<td align=center onMouseOver="menuOn(2)" onMouseOut="menuOff(2)" style="width:100px;height:40;">대메뉴2</td>
</tr>
</table>
<div id="submenu1" onMouseOver="menuOn(1)" onMouseOut="menuOff(1)" style="position:absolute; left:10; top:45; visibility:hidden; background-color:eeeeee;list-style:none;">
<table cellpadding=0 cellspacing=0>
<tr><td><img src="1" alt="소메뉴1-1"></td><td><img src="1" alt="소메뉴1-2"></td></tr>
</table>
</div>
<div id="submenu2" onMouseOver="menuOn(2)" onMouseOut="menuOff(2)" style="position:absolute; left:100; top:45; visibility:hidden; background-color:eeeeee;">
<table cellpadding=0 cellspacing=0>
<tr><td><img src="1" alt="소메뉴2-1"></td><td><img src="1" alt="소메뉴2-2"></td></tr>
</table>
</div>
자주 쓰는 소스입니다 참고 하세요 ㅎ
cshop
13년 전
드랍다운 메뉴 짜시는데 왜 .js 를 쓰시는지 이해 불가네요.. 그냥 css 로 짜시면 되는데.....
게시판 목록
팁게시판
디자인과 관련된 유용한 정보를 공유하세요.
질문은 상단의 QA에서 해주시기 바랍니다.
질문은 상단의 QA에서 해주시기 바랍니다.
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 5827 | 9년 전 | 372 | ||
| 5826 | 9년 전 | 362 | ||
| 5825 | 9년 전 | 325 | ||
| 5824 | 9년 전 | 486 | ||
| 5823 | 9년 전 | 501 | ||
| 5822 | 9년 전 | 301 | ||
| 5821 | 9년 전 | 612 | ||
| 5820 | 9년 전 | 908 | ||
| 5819 | 9년 전 | 442 | ||
| 5818 | 9년 전 | 581 | ||
| 5817 |
|
9년 전 | 1388 | |
| 5816 | 9년 전 | 412 | ||
| 5815 | 9년 전 | 386 | ||
| 5814 | 9년 전 | 357 | ||
| 5813 |
|
9년 전 | 1155 | |
| 5812 | 9년 전 | 462 | ||
| 5811 | 9년 전 | 245 | ||
| 5810 | 9년 전 | 277 | ||
| 5809 | 9년 전 | 476 | ||
| 5808 | 9년 전 | 327 | ||
| 5807 | 9년 전 | 299 | ||
| 5806 | 9년 전 | 272 | ||
| 5805 | 9년 전 | 296 | ||
| 5804 | 9년 전 | 291 | ||
| 5803 | 9년 전 | 281 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기