如何藏身延遲添加到完整的CSS下拉垂直菜單

Question

我有這個劇本，我的CSS垂直菜單：

//Nested Side Bar Menu (Mar 20th, 09) 
//By Dynamic Drive: http://www.dynamicdrive.com/style/ 

var menuids=["sidebarmenu1"] //Enter id(s) of each Side Bar Menu's main UL, separated by commas 

function initsidebarmenu(){ 
for (var i=0; i<menuids.length; i++){ 
    var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul") 
    for (var t=0; t<ultags.length; t++){ 
    ultags[t].parentNode.getElementsByTagName("a")[0].className+=" subfolderstyle" 
    if (ultags[t].parentNode.parentNode.id==menuids[i]) //if this is a first level submenu 
    ultags[t].style.left=ultags[t].parentNode.offsetWidth+"px" //dynamically position first level submenus to be width of main menu item 
    else //else if this is a sub level submenu (ul) 
    ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" //position menu to the right of menu item that activated it 
    ultags[t].parentNode.onmouseover=function(){ 
    this.getElementsByTagName("ul")[0].style.display="block" 
    } 
    ultags[t].parentNode.onmouseout=function(){ 
    this.getElementsByTagName("ul")[0].style.display="none" 
    } 
    } 
    for (var t=ultags.length-1; t>-1; t--){ //loop through all sub menus again, and use "display:none" to hide menus (to prevent possible page scrollbars 
    ultags[t].style.visibility="visible" 
    ultags[t].style.display="none" 
    } 
    } 
} 

if (window.addEventListener) 
window.addEventListener("load", initsidebarmenu, false) 
else if (window.attachEvent) 
window.attachEvent("onload", initsidebarmenu) 

我在哪裏可以使用超時（）從隱藏馬上去菜單延遲？

Answer 1

腳本：

//Nested Side Bar Menu (Mar 20th, 09) 
//By Dynamic Drive: http://www.dynamicdrive.com/style/ 

var menuids=["sidebarmenu1"] //Enter id(s) of each Side Bar Menu's main UL, separated by commas 
var defaultDelay = 0; //ms 

function initsidebarmenu(){ 
    for (var i=0; i<menuids.length; i++){ 
     var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul"); 
     for (var t=0; t<ultags.length; t++){ 
      ultags[t].parentNode.getElementsByTagName("a")[0].className+=" subfolderstyle"; 
      if (ultags[t].parentNode.parentNode.id==menuids[i]){ //if this is a first level submenu 
       ultags[t].style.left=ultags[t].parentNode.offsetWidth+"px"; //dynamically position first level submenus to be width of main menu item 
      } else{ //else if this is a sub level submenu (ul) 
       ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px"; //position menu to the right of menu item that activated it 
      } 
      ultags[t].parentNode.onmouseover=function(){ 
       var elem = this.getElementsByTagName("ul")[0]; 
       if (elem){ 
        if (elem.timer){ 
         clearTimeout(elem.timer); 
        } 
        elem.timer=0; 
        elem.style.display="block"; 
       } 
      } 
      ultags[t].parentNode.onmouseout=function(){ 
       var elem = this.getElementsByTagName("ul")[0]; 
       if (elem){ 
        var delay = defaultDelay; 
        if (elem.parentNode && elem.parentNode.parentNode && elem.parentNode.parentNode.className){ 
         var match = /submenu-delay-([0-9]*)/i.exec(elem.parentNode.parentNode.className); 
         delay = (match && (match.length > 1)) ? match[1] : defaultDelay; 
        } 
        elem.timer=setTimeout(function(){ 
         elem.style.display="none"; 
        }, delay); 
       } 
      }; 
     } 
     for (var t=ultags.length-1; t>-1; t--){ //loop through all sub menus again, and use "display:none" to hide menus (to prevent possible page scrollbars 
     ultags[t].style.visibility="visible" 
     ultags[t].style.display="none" 
     } 
    } 
} 

    if (window.addEventListener) 
    window.addEventListener("load", initsidebarmenu, false) 
    else if (window.attachEvent) 
    window.attachEvent("onload", initsidebarmenu) 

HTML：

<div class="sidebarmenu"> 
<ul id="sidebarmenu1" class='submenu-delay-1000'> 
<li><a href="#">Item 1</a></li> 
<li><a href="#">Item 2</a></li> 
<li><a href="#">Folder 1</a> 
    <ul> 
    <li><a href="#">Sub Item 1.1</a></li> 
    <li><a href="#">Sub Item 1.2</a></li> 
    </ul> 
</li> 
<li><a href="#">Item 3</a></li> 

<li><a href="#">Folder 2</a> 
    <ul> 
    <li><a href="#">Sub Item 2.1</a></li> 
    <li><a href="#">Folder 2.1</a> 
    <ul> 
    <li><a href="#">Folder 2.1.1</a> 
     <ul class='submenu-delay-5000'> 
     <li><a href="#">Sub Item 2.1.1.1</a></li> 
     <li><a href="#">Sub Item 2.1.1.2</a></li> 
     <li><a href="#">Folder 2.1.1.3</a>] 
      <ul > 
      <li><a href="#">Sub Item 2.1.1.3.1</a></li> 
      <li><a href="#">Sub Item 2.1.1.3.2</a></li> 
      </ul> 
     </li> 
     </ul> 
    </li> 
    <li><a href="#">Sub Item 2.1.2</a></li> 
    <li><a href="#">Sub Item 2.1.3</a></li> 
    <li><a href="#">Sub Item 2.1.4</a></li> 
    </ul> 
    </li> 
</ul> 
</li> 
<li><a href="#">Item 4</a></li> 
</ul> 
</div>