CSS3怎样让鼠标移开后弹出菜单马上消失掉啊

html-css018

CSS3怎样让鼠标移开后弹出菜单马上消失掉啊,第1张

我使用setTimeout() 来延时一秒，但没有效果，不知道什么地方出错了，现列出基本代码，请大家指正。

首先，在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秒后就认为用户本身不想使用菜单了，这时候菜单就消失。

一般来说弹出和拉出的菜单都是用JS实现的，因为这属于行为的范畴，CSS只负责外观显示。如果非要用CSS实现的话也可以，做一个链接的伪类

a:hover

然后修改菜单长宽和位置。