首先，在DIV中添加了鼠标动作：<DIV id="xiexiedajia" onmouseover="showlink()" onmouseout="closelink()">
Javascript代码如下
JavaScript code
?
1
2
function closelink(){window.setTimeout('closel()',1000)}
function closel(){document.getElementById("xiexiedajia").style.display="none"}
实现延时一秒的作用是当用户将鼠标点在菜单并往右移动时，偶尔可能移出菜单，这时候菜单就会消失，用户又要重新点开菜单，很不爽，希望能够在鼠标移出很短时间内菜单仍旧存在，这时候用户鼠标又移入时菜单还在。
当用户将鼠标移出超过1秒后就认为用户本身不想使用菜单了，这时候菜单就消失。
在Myeclipse下使用css3方法：
1、【File】---【New】---【Other】
2、在下面的界面，输入css后，出现【web】--【CSS】，选中后，点击【Next】
3、在【FileName】处，输入CSS的名字，如test，点击【Finish】。
每个菜都是一个div，用querySelectorAll选上所有div，然后绑定点击事件，点击的dom节点就是this，改变this的位置和颜色即可。至于折叠效果可以用到css3动画transform 淡入淡出
