
<html>
<head>
<title>3단 레이어</title>
</head>
<body class="frameBody">
<head>
<title>3단 레이어</title>
</head>
<body class="frameBody">
<script type="text/javascript">
var WM_BOTTOM = "bottom";
var WM_RIGHT = "right";
var MARGIN_BOTTOM = 1;
var MARGIN_RIGHT = 1;
var currentItem = null;
var menuTrail = new Array();
var currentStyleOff = null;
var MARGIN_RIGHT = 1;
var currentItem = null;
var menuTrail = new Array();
var currentStyleOff = null;
function wmItemOn(item, level, styleOn, styleOff, submenuId, submenuPosition) {
debug("level:" + level + ", styleOn:" + styleOn + ", styleOff:" + styleOff + ", submenu:" + submenuId + "/" + submenuPosition);
stopOffTimer();
// turn off previous item
if (currentItem != null) {
if (styleOff != currentStyleOff && currentStyleOff != null) {
currentItem.className = currentStyleOff;
} else {
currentItem.className = styleOff;
}
}
if (currentItem != null) {
if (styleOff != currentStyleOff && currentStyleOff != null) {
currentItem.className = currentStyleOff;
} else {
currentItem.className = styleOff;
}
}
// make this item new current item
currentItem = item;
item.className = styleOn;
currentStyleOff = styleOff;
currentItem = item;
item.className = styleOn;
currentStyleOff = styleOff;
if (submenuId != null) {
// take care of attached submenu
hide(level);
var menu = document.getElementById(submenuId);
// item dimensions: item.offsetHeight, item.offsetWidth
if (submenuPosition == WM_BOTTOM) {
menu.style.top = findOffsetTop(item) + item.offsetHeight + MARGIN_BOTTOM;
menu.style.left = findOffsetLeft(item);
}
if (submenuPosition == WM_BOTTOM) {
menu.style.top = findOffsetTop(item) + item.offsetHeight + MARGIN_BOTTOM;
menu.style.left = findOffsetLeft(item);
}
if (submenuPosition == WM_RIGHT) {
menu.style.top = findOffsetTop(item);
menu.style.left = findOffsetLeft(item) + item.offsetWidth + MARGIN_RIGHT;
}
menu.style.top = findOffsetTop(item);
menu.style.left = findOffsetLeft(item) + item.offsetWidth + MARGIN_RIGHT;
}
menu.style.visibility = "visible";
menuTrail[level] = menu;
} else {
hide(level);
}
} else {
hide(level);
}
}
function hide(level) {
for (var i = level; i < menuTrail.length; i++) {
menuTrail[i].style.visibility = "hidden";
}
}
for (var i = level; i < menuTrail.length; i++) {
menuTrail[i].style.visibility = "hidden";
}
}
var timerID = null;
var timerOn = false;
var timecount = 250;
var timerOn = false;
var timecount = 250;
function wmStartOffTimer() {
if (timerOn == false) {
timerID = setTimeout("offAll()", timecount);
timerOn = true;
}
}
if (timerOn == false) {
timerID = setTimeout("offAll()", timecount);
timerOn = true;
}
}
function stopOffTimer() {
if (timerOn) {
clearTimeout(timerID);
timerID = null;
timerOn = false;
}
}
if (timerOn) {
clearTimeout(timerID);
timerID = null;
timerOn = false;
}
}
function offAll() {
hide(0);
if (currentStyleOff != null) {
currentItem.className = currentStyleOff;
}
debug("All off by timer.");
}
hide(0);
if (currentStyleOff != null) {
currentItem.className = currentStyleOff;
}
debug("All off by timer.");
}
var debugId = "wmDebug";
function debug(text) {
var debug = document.getElementById(debugId);
if (debug != null) {
debug.innerHTML = "» " + text + "<br>" + debug.innerHTML;
}
}
var debug = document.getElementById(debugId);
if (debug != null) {
debug.innerHTML = "» " + text + "<br>" + debug.innerHTML;
}
}
function findOffsetLeft(obj){
var curleft = 0;
if (obj.offsetParent){
while (obj.offsetParent){
curleft += obj.offsetLeft
obj = obj.offsetParent;
}
}else if (obj.x){
curleft += obj.x;
}
var curleft = 0;
if (obj.offsetParent){
while (obj.offsetParent){
curleft += obj.offsetLeft
obj = obj.offsetParent;
}
}else if (obj.x){
curleft += obj.x;
}
return curleft;
}
}
// Find total top offset.
function findOffsetTop(obj){
var curtop = 0;
if (obj.offsetParent) {
while (obj.offsetParent){
curtop += obj.offsetTop
obj = obj.offsetParent;
}
}else if (obj.y){
curtop += obj.y;
}
function findOffsetTop(obj){
var curtop = 0;
if (obj.offsetParent) {
while (obj.offsetParent){
curtop += obj.offsetTop
obj = obj.offsetParent;
}
}else if (obj.y){
curtop += obj.y;
}
return curtop;
}
}
</script>
<style>
.wmSubMenuHidden {position:absolute;visibility:hidden;}
.hItemOn {width:100px;padding:3px;background:#DCDCDC;cursor:pointer;}
.hItemOff {width:100px;padding:3px;background:#F0F0F0;cursor:pointer;}
.vItemOn {width:100px;padding:3px;background:#FFFFE6;border:1px solid #336699;cursor:pointer;}
.vItemOff {width:100px;padding:3px;background:#FFFFE6;cursor:pointer;}
</style>
.wmSubMenuHidden {position:absolute;visibility:hidden;}
.hItemOn {width:100px;padding:3px;background:#DCDCDC;cursor:pointer;}
.hItemOff {width:100px;padding:3px;background:#F0F0F0;cursor:pointer;}
.vItemOn {width:100px;padding:3px;background:#FFFFE6;border:1px solid #336699;cursor:pointer;}
.vItemOff {width:100px;padding:3px;background:#FFFFE6;cursor:pointer;}
</style>
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,0,'vItemOn','vItemOff',null,null);" onMouseOut="wmStartOffTimer();">MENU 00</div>
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,0,'vItemOn','vItemOff','vSubmenu1',WM_RIGHT);" onMouseOut="wmStartOffTimer();">MENU 01 »</div>
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,0,'vItemOn','vItemOff','vSubmenu2',WM_RIGHT);" onMouseOut="wmStartOffTimer();">MENU 02 »</div>
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,0,'vItemOn','vItemOff',null,null);" onMouseOut="wmStartOffTimer();">MENU 03</div>
<div id="vSubmenu1" class="wmSubMenuHidden">
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,1,'vItemOn','vItemOff',null,null);" onMouseOut="wmStartOffTimer();">MENU 11</div>
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,1,'vItemOn','vItemOff',null,null);" onMouseOut="wmStartOffTimer();">MENU 12</div>
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,1,'vItemOn','vItemOff','vSubmenu3',WM_RIGHT);" onMouseOut="wmStartOffTimer();">MENU 13 »</div>
</div>
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,1,'vItemOn','vItemOff',null,null);" onMouseOut="wmStartOffTimer();">MENU 11</div>
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,1,'vItemOn','vItemOff',null,null);" onMouseOut="wmStartOffTimer();">MENU 12</div>
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,1,'vItemOn','vItemOff','vSubmenu3',WM_RIGHT);" onMouseOut="wmStartOffTimer();">MENU 13 »</div>
</div>
<div id="vSubmenu2" class="wmSubMenuHidden">
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,1,'vItemOn','vItemOff',null,null);" onMouseOut="wmStartOffTimer();">MENU 21</div>
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,1,'vItemOn','vItemOff',null,null);" onMouseOut="wmStartOffTimer();">MENU 22</div>
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,1,'vItemOn','vItemOff',null,null);" onMouseOut="wmStartOffTimer();">MENU 23</div>
</div>
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,1,'vItemOn','vItemOff',null,null);" onMouseOut="wmStartOffTimer();">MENU 21</div>
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,1,'vItemOn','vItemOff',null,null);" onMouseOut="wmStartOffTimer();">MENU 22</div>
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,1,'vItemOn','vItemOff',null,null);" onMouseOut="wmStartOffTimer();">MENU 23</div>
</div>
<div id="vSubmenu3" class="wmSubMenuHidden">
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,2,'vItemOn','vItemOff',null,null);" onMouseOut="wmStartOffTimer();">MENU 31</div>
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,2,'vItemOn','vItemOff',null,null);" onMouseOut="wmStartOffTimer();">MENU 32</div>
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,2,'vItemOn','vItemOff',null,null);" onMouseOut="wmStartOffTimer();">MENU 33</div>
</div>
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,2,'vItemOn','vItemOff',null,null);" onMouseOut="wmStartOffTimer();">MENU 31</div>
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,2,'vItemOn','vItemOff',null,null);" onMouseOut="wmStartOffTimer();">MENU 32</div>
<div class="vItemOff" onClick="javascript:window.location='#'" onmouseover="javascript:wmItemOn(this,2,'vItemOn','vItemOff',null,null);" onMouseOut="wmStartOffTimer();">MENU 33</div>
</div>
</body>
</html>
</html>
첨부파일
3.html (11.9 KB, 5회)게시판 목록
프로그램
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 6630 |
차가운바람
|
12년 전 | 1160 | |
| 6629 | 12년 전 | 1156 | ||
| 6628 |
put777
|
12년 전 | 642 | |
| 6627 |
|
12년 전 | 698 | |
| 6626 | 12년 전 | 1616 | ||
| 6625 |
|
12년 전 | 718 | |
| 6624 |
미켈란젤로의왼손
|
12년 전 | 481 | |
| 6623 |
|
12년 전 | 1043 | |
| 6622 | 12년 전 | 1391 | ||
| 6621 |
차가운바람
|
12년 전 | 631 | |
| 6620 | 12년 전 | 731 | ||
| 6619 |
|
12년 전 | 969 | |
| 6618 | 12년 전 | 1741 | ||
| 6617 | 12년 전 | 639 | ||
| 6616 |
차가운바람
|
12년 전 | 893 | |
| 6615 | 12년 전 | 2853 | ||
| 6614 | 12년 전 | 614 | ||
| 6613 |
강명구베드로
|
12년 전 | 529 | |
| 6612 |
|
12년 전 | 424 | |
| 6611 | 12년 전 | 1206 | ||
| 6610 | 12년 전 | 1022 | ||
| 6609 | 12년 전 | 3679 | ||
| 6608 |
|
12년 전 | 831 | |
| 6607 | 12년 전 | 692 | ||
| 6606 | 12년 전 | 565 | ||
| 6605 | 12년 전 | 454 | ||
| 6604 | 12년 전 | 974 | ||
| 6603 |
geektoo
|
12년 전 | 699 | |
| 6602 | 12년 전 | 840 | ||
| 6601 | 12년 전 | 363 | ||
| 6600 | 12년 전 | 404 | ||
| 6599 | 12년 전 | 544 | ||
| 6598 | 12년 전 | 936 | ||
| 6597 | 12년 전 | 938 | ||
| 6596 | 12년 전 | 419 | ||
| 6595 | 12년 전 | 791 | ||
| 6594 | 12년 전 | 4576 | ||
| 6593 | 12년 전 | 2579 | ||
| 6592 | 12년 전 | 828 | ||
| 6591 | 12년 전 | 586 | ||
| 6590 |
|
12년 전 | 1391 | |
| 6589 | 12년 전 | 764 | ||
| 6588 |
GINUSSOFT
|
12년 전 | 5129 | |
| 6587 | 12년 전 | 6213 | ||
| 6586 | 12년 전 | 1049 | ||
| 6585 | 12년 전 | 805 | ||
| 6584 | 12년 전 | 461 | ||
| 6583 |
|
12년 전 | 983 | |
| 6582 | 12년 전 | 871 | ||
| 6581 | 12년 전 | 841 | ||
| 6580 | 12년 전 | 617 | ||
| 6579 |
알랑가몰라
|
12년 전 | 927 | |
| 6578 | 12년 전 | 1332 | ||
| 6577 | 12년 전 | 1502 | ||
| 6576 |
경dragon
|
12년 전 | 771 | |
| 6575 | 12년 전 | 1883 | ||
| 6574 | 12년 전 | 684 | ||
| 6573 | 12년 전 | 984 | ||
| 6572 |
|
12년 전 | 1668 | |
| 6571 |
CTOMAN
|
12년 전 | 1960 | |
| 6570 | 12년 전 | 1731 | ||
| 6569 | 12년 전 | 1889 | ||
| 6568 | 12년 전 | 2406 | ||
| 6567 | 12년 전 | 1032 | ||
| 6566 |
lainfox
|
12년 전 | 1535 | |
| 6565 | 12년 전 | 3655 | ||
| 6564 |
제주프라이스
|
12년 전 | 1536 | |
| 6563 | 12년 전 | 1575 | ||
| 6562 |
프로프리랜서
|
12년 전 | 1345 | |
| 6561 |
프로프리랜서
|
12년 전 | 964 | |
| 6560 |
프로프리랜서
|
12년 전 | 1221 | |
| 6559 |
프로프리랜서
|
12년 전 | 1139 | |
| 6558 |
프로프리랜서
|
12년 전 | 1359 | |
| 6557 |
프로프리랜서
|
12년 전 | 1983 | |
| 6556 |
프로프리랜서
|
12년 전 | 1530 | |
| 6555 |
프로프리랜서
|
12년 전 | 1371 | |
| 6554 |
프로프리랜서
|
12년 전 | 3891 | |
| 6553 |
프로프리랜서
|
12년 전 | 1513 | |
| 6552 | 12년 전 | 845 | ||
| 6551 |
왕초보sasa
|
12년 전 | 1535 | |
| 6550 |
왕초보sasa
|
12년 전 | 634 | |
| 6549 |
왕초보sasa
|
12년 전 | 910 | |
| 6548 | 12년 전 | 1302 | ||
| 6547 | 12년 전 | 1196 | ||
| 6546 | 12년 전 | 5162 | ||
| 6545 | 12년 전 | 2520 | ||
| 6544 |
AnnieK
|
12년 전 | 1779 | |
| 6543 |
베르무트7
|
12년 전 | 638 | |
| 6542 |
오늘도망했다
|
12년 전 | 2233 | |
| 6541 | 12년 전 | 819 | ||
| 6540 | 12년 전 | 1138 | ||
| 6539 | 12년 전 | 850 | ||
| 6538 |
senseme
|
12년 전 | 3377 | |
| 6537 | 12년 전 | 779 | ||
| 6536 | 12년 전 | 3669 | ||
| 6535 | 12년 전 | 1349 | ||
| 6534 | 12년 전 | 1624 | ||
| 6533 | 12년 전 | 2244 | ||
| 6532 |
냐옹이사범
|
12년 전 | 2307 | |
| 6531 | 12년 전 | 571 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기