接近水平下拉菜单

Question

我工作过的一些代码，我发现这里的堆栈溢出下拉菜单：http://jsfiddle.net/jhoffm34/VbtuC/

我有上点击后展开一个jQuery下拉菜单。我尝试使用document.onmousedown让菜单关闭，当我第二次点击“类别”时，但它只是立即重新打开菜单。有谁知道如何解决这一问题？

Answer 1

工作演示
http://jsfiddle.net/RguMu/show
http://jsfiddle.net/RguMu/
http://jsfiddle.net/UK9Qt/ - 只有当类别被点击的显示和隐藏

所以在第二次点击，您的菜单现在将关闭：

使用is(':visible')

另一个建议，你不需要这么多的公关operties。只需做show和hide，休息你就会更好地了解你的需求。

jQuery代码

if(submenu.is(':visible')){ 
    submenu.hide(); 
    return false; 
} 

的完整代码

var timeout = 999999; 
var closetimer = 0; 
var ddmenuitem = 0; 

function jsddm_open(event) { 
    jsddm_canceltimer(); 
    jsddm_close(); 
    var submenu = $(this).find('ul'); 

    if(submenu.is(':visible')){ 
     submenu.hide(); 
     return false; 
    } 

    if (submenu) { 
     ddmenuitem = submenu.css('visibility', 'visible'); 
     ddmenuitem = submenu.css('position', 'relative'); 
     submenu.show(); 
     return false; 
    } 

    return true; 
} 

function jsddm_close() { 
    if (ddmenuitem) ddmenuitem.css('visibility', 'hidden'); 
    if (ddmenuitem) ddmenuitem.css('position', 'fixed'); 
} 

function jsddm_timer() { 
    closetimer = window.setTimeout(jsddm_close, timeout); 
} 

function jsddm_canceltimer() { 
    if (closetimer) { 
     window.clearTimeout(closetimer); 
     closetimer = null; 
    } 
} 

$(document).ready(function() { 
    $('#jsddm li').bind('click', jsddm_open); 
    $('#jsddm > li').bind('mouseout', jsddm_timer); 
    $('#jsddm > li').bind('mouseover', jsddm_canceltimer); 
    $('#jsddm li').find('ul').hide(); 

}); 

document.onmousedown = jsddm_close;