在JavaScript中如何实现菜单级联？

我只在IE下实现过简单的菜单，用的是DHTML中的层的DISPLAY属性。也就是一个层在LOAD时，是不显示的，DISPLAY为NONE，当鼠标动作时，才将DISPLAY的值改为BLOCK。
下面是我做的很简单的一个页面。
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<link rel="stylesheet" href="../dream.css">
<SCRIPT ID=clientEventHandlersJS LANGUAGE=javascript>
<!--function divlesson_onmouseover() {
  divlessonin.style.display="block";
}function divlesson_onmouseout() {
  divlessonin.style.display="none";
}function window_onload() {
  divlessonin.style.display="none";
}//-->
</SCRIPT>
</head><body bgcolor="#ffffff" LANGUAGE=javascript onload="return window_onload()">
<div id="divlesson" style="HEIGHT: 198px; LEFT: 23px; POSITION: absolute; TOP: 25px; WIDTH: 129px; Z-INDEX: 1" LANGUAGE=javascript onmouseover="return divlesson_onmouseover()" onmouseout="return divlesson_onmouseout()"> 
  学习科目 
</div>
<div id="divlessonin" style="HEIGHT: 163px; LEFT: 25px; POSITION: absolute; TOP: 57px; WIDTH: 123px"    >
  <p>计算机原理</p>
  <p> 程序设计</p>
  <p>网页制作</p>
  <p>数据库</p>
  <p>微机操作<br>
  </p>
</div> 
</body>
</html>