리스트페이지에서는 정상작동
뷰페이지에서만 레이어가 펼쳐집니다.

뭐가 잘못된건지 알수가 없네요

정상 작동 : http://icode.ivyro.net/bbs/board.php?bo_table=java
오류(메뉴펼처짐) : http://icode.ivyro.net/bbs/board.php?bo_table=html&wr_id=6


오류 소스


<style type='text/css'>
.ad
{
    clear:both;
    text-align:center;
    padding:5px;
}


/* END DEMO CSS */
#dhtmlgoodies_menu
{
    font-family:arial;  /* Font for main menu items */
    width:184px;        /* Width of main menu */


}


#dhtmlgoodies_menu li  /* Main menu <li> */
{
    list-style-type:none;  /* No bullets */
    margin:0px;            /* No margin - needed for Opera */
}


#dhtmlgoodies_menu ul
{
    margin:0px;    /* No <ul> air */
    padding:0px;    /* No <ul> air */
}


#dhtmlgoodies_menu ul li ul /* Styling for those who doesn't have javascript enabled */
{
    padding-left:10px;
}


#dhtmlgoodies_menu    li a /* Main menu links */
{
    text-decoration:none;      /* No underline */
    color:#333333;                /* Black text color */
    height:20px;                /* 20 pixel height */
    line-height:20px;          /* 20 pixel height */
    vertical-align:middle;      /* Align text in the middle */
    border:1px solid #DEDEDE;      /* Black border */
    background-color:#FAFAFA;  /* Light blue background color */
    margin:3px;                /* A little bit of air */
    padding:1px;                /* Air between border and text inside */
    display:block;
}


#dhtmlgoodies_menu li a:hover, #dhtmlgoodies_menu .activeMainMenuItem
{
    color:#FFFFFF;
    background-color:#317082;
}


.dhtmlgoodies_subMenu
{
    visibility:hidden;
    position:absolute;
    overflow:hidden;
    border:1px solid #DEDEDE;
    background-color:#FAFAFA;
    font-family:arial;
    text-align:left;
}


.dhtmlgoodies_subMenu ul
{
    margin:0px;
    padding:0px;
}


.dhtmlgoodies_subMenu ul li
{
    list-style-type:none;
    margin:1px;
    padding:1px;    /* 1px of air between submenu border and sub menu item - (the 'white' space you see on mouse over )*/
}


.dhtmlgoodies_subMenu ul li a /* Sub menu items */
{
    white-space:nowrap;    /* No line break */
    text-decoration:none;  /* No underline */
    color:#333333;            /* Black text color */
    height:16px;            /* 16 pixels height */
    line-height:16px;      /* 16 pixels height */
    padding:1px;            /* 1px of 'air' inside */
    display:block;          /* Display as block - you shouldn't change this */
}


.dhtmlgoodies_subMenu ul li a:hover /* Sub menu items - mouse over effects */
{
    color:#FFFFFF;                /* White text */
    background-color:#317082;  /* Blue background */
}
</style>
<script type='text/javascript'>
var MENUDIV_ID      = 'dhtmlgoodies_menu';
var SUBMENU_CLASS  = 'dhtmlgoodies_subMenu';
var menuItems;
var slideSpeed_out  = 20;  // Steps to move sub menu at a time ( higher = faster)
var slideSpeed_in  = 20;
var delayMenuClose  = 150;  // Microseconds from mouseout to close of menu
var slideTimeout_out= 25;  // Microseconds between slide steps ( lower = faster)
var slideTimeout_in = 10;  // Microseconds between slide steps ( lower = faster)
var xOffsetSubMenu  = 0;    // Offset x-position of sub menu items - use negative value if you want the sub menu to overlap main menu
/* Don't change anything below here */
var indeces = new Array();
indeces[0] = 0;
var isMSIE = navigator.userAgent.indexOf('MSIE')>=0?true:false;
var browserVersion = parseInt(navigator.userAgent.replace(/.*?MSIE ([0-9]+?)[^0-9].*/g,'$1'));
if(!browserVersion)browserVersion=1;


function mouseOn(obj)
{
    var mi = findNode(getSearchIdFromObj(obj));
    if (mi) mi.mouseOn();
    setColor( obj.className, '#FFFFFF', '#317082' );
}


function mouseOff(obj)
{
    var mi = findNode(getSearchIdFromObj(obj));
    if (mi) mi.mouseOff();
    setColor( obj.className, '#333333', '#FAFAFA' );
}


function getSearchIdFromObj(obj)
{
    // pull the postfix off the A link or LI tag id and return the menu item ID
    var objId = obj.id;
    var idx = objId.indexOf('_');
    if (idx>=0)
    {
        return 'MenuItem' + objId.substring(idx);
    }
    return null;
}


function slideChildMenu(aId)
{
    var mi = findNode(aId);
    if (mi) mi.slideChildMenu();
}


function findNode(searchId)
{
    var result;
    for (var no=0;no<menuItems.length;no++)
    {
        result = menuItems[no].findNode(searchId);
        if (result) return result;
    }
    return null;
}


function getNextIndex(lvl)
{
    var result = 0;
    if (indeces.length<=lvl)
    {
        indeces[lvl] = 1;
    }
    else
    {
        result = indeces[lvl];
        indeces[lvl]++;
    }
    return result;
}


function MenuItem(divref, ulref, liref, lvlnum, parentref)
{
    this.parent            = parentref;
    this.div                = divref;
    this.ul                = ulref;
    this.width              = this.ul.offsetWidth;
    // this.left = div.style.left.replace(/[^0-9]/g,'');
    this.li                = liref;
    this.alink              = this.li.getElementsByTagName('A')[0];
    this.lvl                = lvlnum;
    this.idx                = getNextIndex(this.lvl);
    this.children;
    this.subUL              = this.li.getElementsByTagName('UL')[0];
    this.children;
    this.isMouseOnMe        = false;
    // note: if !isOpen && !isClosed then I am animating a slide
    this.isChildMenuOpen    = false;
    this.isChildMenuClosed  = true;
    // Constructor
    // if a node does not have an A tag but it's children do then we need
    // null out this node's alink field...
    if (this.alink)
    {
        if (this.alink.parentNode!=this.li) this.alink = null;
    }


    if (this.subUL)
    {
        this.children = new Array();
        var subLI = this.subUL.getElementsByTagName('LI')[0];
        while(subLI)
        {
            if(subLI.tagName && subLI.tagName.toLowerCase()=='li')
            {
                this.children[this.children.length] = new MenuItem(null, this.subUL, subLI, this.lvl + 1, this);
            }
            subLI = subLI.nextSibling;
        }
    }


    this.getPostfix = function()
    {
        return '_' + this.idx + '_' + this.lvl;
    }


    this.getId = function()
    {
        return 'MenuItem' + this.getPostfix();
    }


    this.hasChildren = function()
    {
        return (this.children!=null);
    }


    this.getTopPos = function()
    {
        var origDisp            = this.div.style.display;
        this.div.style.display  = '';
        var obj                = this.li;
        var result              = obj.offsetTop;
        while((obj = obj.offsetParent) != null) result += obj.offsetTop;
        this.div.style.display  = origDisp;
        return result;
    }


    this.getLeftPos = function()
    {
        var origDisp            = this.div.style.display;
        this.div.style.display  = '';
        var obj                = this.li;
        var result              = obj.offsetLeft;
        while((obj = obj.offsetParent) != null) result += obj.offsetLeft;
        this.div.style.display  = origDisp;
        return result;
    }


    this.renderNode = function()
    {
        // set node properties
        this.li.id = 'menuItemLI' + this.getPostfix();
        this.ul.style.position = 'relative';
        if (this.alink)
        {
            this.alink.id = 'menuItemA' + this.getPostfix();
            this.alink.onmouseover = function() {mouseOn(this);};
            this.alink.onmouseout = function() {mouseOff(this);};
        }
        else
        {
            this.li.onmouseover = function() {mouseOn(this);};
            this.li.onmouseout = function() {mouseOff(this);};
        }


        // set sub-menu nodes
        if (this.hasChildren())
        {
            var mi                  = this.children[0];
            var subdiv              = document.createElement('DIV');
            subdiv.className        = SUBMENU_CLASS;
            document.body.appendChild(subdiv);
            subdiv.id              = 'menuItemDIV' + mi.getPostfix();
            this.subUL.id          = 'menuItemUL' + mi.getPostfix();
            subdiv.appendChild(this.subUL);
            subdiv.style.left      = this.getLeftPos() + this.width + xOffsetSubMenu + 'px';
            subdiv.style.top        = this.getTopPos() + 'px';
            subdiv.style.visibility = 'hidden';
            subdiv.style.display    = 'none';
            subdiv.style.zindex    = '1000';


            for (var no=0;no<this.children.length;no++)
            {
                var mi  = this.children[no];
                mi.div  = subdiv;
                mi.renderNode();
            }
        }
        return this.li;
    }


    this.findNode = function(searchId)
    {
        var result;
        if (this.getId() == searchId)
        {
            result = this;
        }
        else
        {
            if (this.hasChildren())
            {
                for (var no=0;no<this.children.length;no++)
                {
                    var mi = this.children[no];
                    result = mi.findNode(searchId);
                    if (result!=null) break;
                }
            }
        }
        return result;
    }


    this.mouseOn = function()
    {
        this.isMouseOnMe = true;
        if (this.hasChildren() && this.isChildMenuClosed)
        {
            this.initiateChildMenuOpen();
        }
    }


    this.mouseOff = function()
    {
        this.isMouseOnMe = false;
        if (this.hasChildren() && !this.isChildMenuClosed)
        {
            this.initiateChildMenuClose();
        }
        else if (this.parent)
        {
            this.parent.mouseOff();
        }
    }


    this.isMouseOnChild = function()
    {
        if (this.isMouseOnMe) return true;
        if (this.hasChildren())
        {
            for (var no=0;no<this.children.length;no++)
            {
                if (this.children[no].isMouseOnChild()) return true;
            }
        }
        return false;
    }


    this.initiateChildMenuOpen = function()
    {
        this.isChildMenuClosed = false;
        var childDiv = this.children[0].div;
        childDiv.style.width = '0px';
        childDiv.style.visibility = 'visible';
        childDiv.style.display = '';
        this.slideChildMenu();
    }


    this.initiateChildMenuClose = function()
    {
        this.isChildMenuOpen = false;
        // we have to wait to close the menu
        // allow the mouse to navigate over the child menu
        setTimeout('slideChildMenu("' + this.getId() + '")', delayMenuClose);
    }


    this.slideChildMenu = function()
    {
        var divref      = this.children[0].div;
        var ulref      = this.children[0].ul;
        var maxwidth    = this.children[0].width;
        var nextWidth;
        if (this.isMouseOnMe  || this.isMouseOnChild())
        {
            nextWidth = divref.offsetWidth + slideSpeed_out;
            if (nextWidth >= maxwidth)
            {
                this.finishOpeningChild(divref, ulref, maxwidth);
            }
            else
            {
                ulref.style.left = nextWidth - maxwidth + 'px';
                divref.style.width = nextWidth + 'px';
                setTimeout('slideChildMenu("' + this.getId() + '")', slideTimeout_out);
            }
        }
        else
        {
            nextWidth = divref.offsetWidth - slideSpeed_in;
            if (nextWidth <= 0)
            {
                this.finishClosingChild(divref, ulref, maxwidth);
            }
            else
            {
                ulref.style.left = nextWidth - maxwidth + 'px';
                divref.style.width = nextWidth + 'px';
                setTimeout('slideChildMenu("' + this.getId() + '")', slideTimeout_out);
            }
        }
    }


    this.finishOpeningChild = function(divref, ulref, maxwidth)
    {
        this.isChildMenuOpen = true;
        this.isChildMenuClosed = false;
        ulref.style.left = '0px';
        divref.style.width = maxwidth + 'px';
    }


    this.finishClosingChild = function(divref, ulref, maxwidth)
    {
        this.isChildMenuOpen = false;
        this.isChildMenuClosed = true;
        divref.style.visibility = 'hidden';
        divref.style.display = 'none';
        divref.style.width = maxwidth + 'px';
        if (this.parent) this.parent.mouseOff();
    }
}


function collectMenuNodes(menuObj)
{
    if (!menuObj) return null;
    var results = new Array();
    var menuUL  = menuObj.getElementsByTagName('UL')[0];
    var menuLI  = menuUL.getElementsByTagName('LI')[0];
    while(menuLI)
    {
        if(menuLI.tagName && menuLI.tagName.toLowerCase()=='li')
        {
            results[results.length] = new MenuItem(menuObj, menuUL, menuLI, 0, null);
        }
        menuLI = menuLI.nextSibling;
    }
    return results;
}


function initMenu()
{
    var mainDiv = document.getElementById(MENUDIV_ID);
    menuItems = collectMenuNodes(mainDiv);
    if (menuItems)
    {
        for (var no=0;no<menuItems.length;no++)
        {
            var mi = menuItems[no];
            mi.renderNode();
        }
        mainDiv.style.visibility = 'visible';
    }
    // window.onresize = resetPosition;
}


function setColor( className, fontColor, bgColor )
{
    var as  = document.all.tags('a');
    for( var i=0; i<as.length; i++ )
    {
        if(as[i].className==className)
        {
            as[i].style.color = fontColor;
            as[i].style.backgroundColor = bgColor;
        }
    }
    if( className.length>6 )
    {
        setColor(className.substring(0,className.length-2), fontColor, bgColor );
    }
}


window.onload = initMenu;
</script>
    </head>
    <body>






        <div id='dhtmlgoodies_menu'>
            <ul>
                <li>
                    <a href="<?=$g4['path']?>/bbs/board.php?bo_table=html"  class='menu01'>HTML,Script</a>
                    <ul>
                        <li><a href="<?=$g4['path']?>/bbs/board.php?bo_table=html&sca=HTML" class='menu0101'>HTML</a></li>
                        <li><a href="<?=$g4['path']?>/bbs/board.php?bo_table=html&sca=Java Script" class='menu0102'>Java Script</a></li>
                        <li><a href="<?=$g4['path']?>/bbs/board.php?bo_table=html&sca=css" class='menu0103'>CSS/스타일시트</a></li>

                    </ul>
                </li>
                <li>
                    <a href='#' class='menu02'>드림위버 Dreamweaver</a>
                    <ul>
                        <li><a href='#' class='menu0201'>드림위버 CS</a></li>
                        <li><a href='#' class='menu0202'>드림위버 CS2</a></li>
                        <li><a href='#' class='menu0203'>드림위버 CS3</a></li>
                        <li><a href='#' class='menu0204'>드림위버 CS4</a></li>
                    </ul>
                </li>
                <li>
                    <a href='#' class='menu03'>스위시 Swish</a>
                    <ul>
                        <li><a href='#' class='menu0301'>Appear into position</a></li>
                        <li><a href='#' class='menu0302'>Disppear into position</a></li>
                        <li><a href='#' class='menu0303'>One off</a></li>
<li><a href='#' class='menu0304'>Return to start</a></li>
                    </ul>
                </li>
                <li>
                    <a href='#' class='menu04'>공지사항</a>
                    <ul>
                        <li><a href='#' class='menu0401'>공지사항</a></li>
                        <li><a href='#' class='menu0402'>새소식</a></li>
                        <li><a href='#' class='menu0403'>이벤트</a></li>
                    </ul>
                </li>
                <li>
                    <a href='#' class='menu05'>커뮤니티</a>
                    <ul>
                        <li><a href='#' class='menu0501'>자유게시판</a></li>
                        <li><a href='#' class='menu0502'>갤러리</a></li>
                        <li><a href='#' class='menu0503'>묻고답하기 Q&A</a></li>
                        <li><a href='#' class='menu0504'>자주묻는질문 FAQ</a></li>
                    </ul>
                </li>
                                <li>
                    <a href='#' class='menu06'>자료실</a>
                    <ul>
                        <li><a href='#' class='menu0601'>포토샵 PSD</a></li>
                        <li><a href='#' class='menu0602'>일러스트 AI</a></li>
                        <li><a href='#' class='menu0603'>플래시 FLA</a></li>
                        <li><a href='#' class='menu0604'>스위시 SWI</a></li>
                        <li><a href='#' class='menu0605'>그누보드4 Skin</a></li>
                    </ul>
                </li>
            </ul>
        </div>