javascript弹出层菜单求助[mootools]

html文档结构如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
<title>无标题文档</title>
</head>
<body>
<div id="sitepage">
<script src="mootools-release.js" type="text/javascript"></script>
<style type="text/css">
<!--
body{margin:0;padding:0;background-color:#333;font-family:Arial, Helvetica, sans-serif;font-size:14px;}
#sitepage{margin:auto;width:1000px;height:auto;}
#sitehead *{margin:0;padding:0;}
#sitehead{position:relative;float:left;width:100%;height:auto;background-color:#fff;}#tophead{float:left;width:100%;height:35px;background-color:#ddd;border-bottom:1px solid #999;}
#tophead ul{float:left;list-style:none;}
#tophead ul li{float:left;display:inline;padding:10px 10px 0 10px;width:auto;height:20px;text-align:center;color:#333;}#usersystem{float:left;width:100%;height:auto;border-bottom:1px dashed #eee;}
#usersystem ul{float:right;list-style:none;height:25px;}
#usersystem ul li{float:left;padding:5px 10px 0 20px;height:20px;font-size:14px;color:#999;}#categoryset{float:left;padding:100px 0 0 20px;width:980px;height:auto;}
#categoryset h3{float:left;width:940px;padding:10px;color:#666;border:1px solid #ddd;}#sitebody{float:left;margin:0;width:100%;height:auto;min-height:500px;background-color:#fff;}
#sitebody{height:expression(this.scrollHeight<500?"500px":"auto");}#sitefoot{float:left;margin:0;width:100%;height:auto;background-color:#ddd;}
#sitefoot span{float:right;padding:10px 10px 0 0;margin:0;width:260px;height:35px;}
* a:link,* a:visited{text-decoration:none;color:#333;}
#childmenu{position:absolute;top:30px;left:0;width:100%;height:40px;background-color:#333;color:#fff;z-index:10;visibility:hidden;-moz-opacity:.70;filter:alpha(opacity=70); opacity:.70;}
#childmenu div.extendchild{float:left;padding:10px 10px 0 10px;height:20px;display:none;width:980px;}
#childmenu div.extendchild ul{display:inline;list-style:none;}
#childmenu div.extendchild ul li{float:left;padding:0px 15px 0px 15px;font-size:12px;color:#eee;}
#childmenu div.extendchild ul li a:link{color:#eee;}
#childmenu div.extendchild ul li a:visited{color:#ccc;}
-->
</style>
<script type="text/javascript">
(function(){
    window.addEvent('load',function(){
         if($('tophead')){
               var licols=$('tophead').getElements('a');
               for ( var j = 0; j < licols.length; j++) {
                    licols[j].addEvent('mouseenter',function(event){
new Event(event).stop();
var parentConn=this.parentNode.id;
                     var childMenuID = parentConn.split('_')[1];
         var curr=$('child_'+childMenuID);
curr.setStyles({
display:'block',
visibility:'visible',
backgroundColor:'#666'
});
                    });
licols[j].addEvent('mouseleave',function(event){
    new Event(event).stop();
var parentConn=this.parentNode.id;
                     var childMenuID = parentConn.split('_')[1];
         var curr=$('child_'+childMenuID);
curr.setStyles({
display:'none',
visibility:'hidden'
});
});
               }
         }
    })
})();  
</script>
<div id="sitehead">
     <div id="tophead">
      <ul>
         <li id="main_0"><a href="#">部门</a></li>
            <li id="main_1"><a href="#">职员</a></li>
            <li id="main_2"><a href="#">查询</a></li>
            <li id="main_3"><a href="#">材料</a></li>
            <li id="main_4"><a href="#">客户</a></li>
            <li id="main_5"><a href="#">档案</a></li>            
        </ul>
     </div>
     <div id="childmenu">
      <div id="child_0" class="extendchild">
         <ul>
             <li><a href="#">部门列表</a></li>
                <li><a href="#">在职部门</a></li>
                <li><a href="#">同事列表</a></li>
                <li><a href="#">部门领导</a></li>
            </ul>
        </div>
        <div id="child_1" class="extendchild">
         <ul>
             <li><a href="#">新来职员</a></li>
                <li><a href="#">在职员工</a></li>
                <li><a href="#">曾经同事</a></li>
            </ul>
        </div>
        <div id="child_2" class="extendchild">
         <ul>
             <li><a href="#">职员查询</a></li>
                <li><a href="#">材料查询</a></li>
                <li><a href="#">客户查询</a></li>
                <li><a href="#">档案查询</a></li>
            </ul>
        </div>
        <div id="child_3" class="extendchild">
         <ul>
             <li><a href="#">材料列表</a></li>
                <li><a href="#">作费的材料</a></li>
            </ul>
        </div>
        <div id="child_4" class="extendchild">
         <ul>
             <li><a href="#">本市客户</a></li>
                <li><a href="#">本省客户</a></li>
                <li><a href="#">省外客户</a></li>
                <li><a href="#">海外客户</a></li>                
            </ul>
        </div>
        <div id="child_5" class="extendchild">
         <ul>
             <li><a href="#">档案管理</a></li>
            </ul>
        </div>     </div>
     
     <div id="usersystem">
        <ul>         
            <li>Hi, admin</li>
            <li><a href="#">Profile</a></li>
            <li><a href="#">Sign Out</a></li>
        </ul>        
     </div>     
     <div id="categoryset">        
                <h3>Welcome interview:admin</h3>                
     </div>
</div>
   <div id="sitebody">        </div>
</div>
</body>
</html>现在弹出层可以显示出来.但无法点选子层的连接.请会mootools的兄弟帮助解决一下