CSS下拉框菜单关闭时间延迟？

Question

我的网站有一个管理区域，用户需要看到通知。

我用CSS下拉菜单设置了整个通知的想法，但是当光标离开菜单时我似乎无法让菜单保持打开状态

我已将文件上传到JSbin，希望有人可以帮助我

http://jsbin.com/ecegiy/1

在那里看起来并不多，因为所有的图像和mysql连接文件都不包括在内，但css菜单的想法包含在链接中。

Answer 1

好的，如果您想让菜单保持打开状态，我建议：

• 删除子菜单上的悬停的css部分
  #menu li:hover ul.sub-menu { display: block; }
• 给你的菜单一个id <ul id="childDisplay" class="sub-menu">
• 将javascript添加到上层元素，它始终可见 <li onmouseover="menuVis.visible('childDisplay');" onmouseout="setTimeout('menuVis.unvisible(\'childDisplay\')',1000);">

• 添加javascript类和方法：

  function vis(){
      this.flag=0;
      this.flagUnv=0;
  
      this.visible=function(x){
        this.flag=this.flag+1;
        document.getElementById(x).style.display="block";
  
      }
  
  
      this.unvisible= function (x){
            this.flagUnv=this.flagUnv+1;
            if(this.flagUnv==this.flag)
                 document.getElementById(x).style.display="none";    
          }
  }
  menuVis=new vis();
  }
  

这样，子菜单将在1000ms后变为不可见。如果你想“永远”保持它的可见性，只需删除onmouseout部分和不可见的功能。